Jquery阻止拖动文本值

时间:2010-05-06 12:11:33

标签: jquery copy-paste drag

我有一个html文本框,我通过jQuery将一个函数绑定到粘贴事件,以防止用户将值粘贴到文本框中。此功能很有效。

但是,可以从页面上的另一个文本框中选择一些文本,然后将其拖到阻止粘贴的文本框中。是否有一个我可以绑定的jQuery事件会阻止用户将文本拖入texbox?

5 个答案:

答案 0 :(得分:3)

首先,您不应该阻止用户复制和粘贴或点击并从一个输入拖动到另一个输入。大多数人都鄙视确认电子邮件输入框,我就是其中之一。使其更难填写只会激怒用户。

然而...... 警告黑客警告 ......

您无法阻止内置浏览器功能,但可以禁止在您不想拖动的输入中选择文本,如下所示:

选项1:

$(document).ready(function () {

    // Get the control from which the drag should be disallowed
    var originator = $(".start");

    // Disable text selection
    if ($.browser.mozilla) {
        originator.each(function () { $(this).css({ 'MozUserSelect': 'none' }); });
    } 
    else if ($.browser.msie) {
        originator.each(function () { $(this).bind('selectstart.disableTextSelect', 
           function () { return false; }); });
    } 
    else {
        originator.each(function () { $(this).bind('mousedown.disableTextSelect', 
           function () { return false; }); });
    }

});

但是,这真的很烦人。

选项2:

您可以在用户拖动项目时禁用确认框:

$(document).ready(function () {

    // Get the control which dropping should be disallowed
    var originator = $("#emailBox");

    // Trap when the mouse is up/down
    originator.mousedown(function (e) {
        $("#confirmationBox").attr('disabled', 'disabled');
    });
    originator.mouseup(function (e) {
        $("#confirmationBox").attr('disabled', '');
    });

});

选项3:

让您的用户群受宠,并摆脱确认框。

答案 1 :(得分:1)

ondrop="return false;"添加到要禁用放置文本的那些输入元素。

input {
  -webkit-user-select: auto;
  user-select: auto;
  -webkit-user-drag: none;
}
<article>
  <input type="text" placeholder="Write text, select it, and drag" >
  <input type="text" placeholder="Then drop text here" ondrop="return false;">
</article>

答案 2 :(得分:0)

两种解决方案

1 您可以通过以下方式表达问题:您希望用户使用键盘输入值。您可以计算击键次数。然后,在更改事件中,当输入失去焦点时,您的击键次数应至少等于值中字符的数量。

2 您可以使用区间函数来频繁检查输入值的差异。如果差异突然包含太多字符,则忽略该更改,因为它只能归因于文本粘贴。您需要决定在该时间范围内人们可以实现的频率和最大击键次数。

答案 3 :(得分:0)

在我的情况下,基于@Prateek的回答,我在jquery中做了一些事情:我已经在某些特定的文本中添加了以下属性:ondrop =“ return false;” ...

我的代码是:

// Prevents to drag and drop from text input fields.
    $("#MyInput").attr("ondrop","return false;");

添加后,它运行良好。

希望这可以帮助其他人。

答案 4 :(得分:-2)

不幸的是,这是不可能的。