检测到 HTML 文本框的拖放？

我的网页上有一个正常的搜索框。它充满了文字：Search this website

当您单击框中输入搜索查询时，此文本将被删除：

onfocus="if(this.value=='Search this website') { this.value=''};

但是，我如何才能检测到有人将文本从页面拖到搜索框（就像我自己经常做的那样）？onfocus不会触发并且保留先前的文本。

您需要使用ondrop事件，只有在以下情况下才会触发翁德拉根特 and 翁德拉戈弗活动被取消。事实证明这有点棘手，因为 Firefox 中的行为与 IE、Safari 和 Chrome 中不同。

(function () {
    var inp = document.getElementById("test"),
        chg = false;

    inp.ondragover = inp.ondragenter = function () {
        chg = inp.value == "Drop here";
        return false;
    }
    inp.ondrop = function (evt) {
        evt = evt || event;

        if (chg) {
            this.value = evt.dataTransfer.getData("text")
                         || evt.dataTransfer.getData("text/plain");
            return false;
        }
    }
})();

Example http://jsfiddle.net/23vB6/- Firefox 3+、IE5+、Chrome 和 Safari。据我所知，Opera 不支持该活动。但至少你可以让它为 95% 的访问者工作。

拖动操作 - MDC https://developer.mozilla.org/En/DragDrop/Drag_Operations