Question

我在下面的Div中有两张桌子。除此之外，我想在一个表上防止拖放功能，而其他表应该具有拖放功能。

我能够成功停止拖放Div级别（请参阅工作代码，我从Disable Drag and Drop on HTML elements?找到此代码）但是，当我尝试将类似的代码分配给特定的表时，它不起作用，我能够对这些表执行拖放操作。

HTML：

<div class="test">
    <table id="s_1" summary="Table 1" > </table> 
    <table id="s_2" summary="Table 2" > </table> 
</div>

Java脚本：

工作：

/* drag and drop    */

            $('.test').bind("dragover", function(e) {
                e.preventDefault();
                return false;
            });

            $('.test').bind("drop", function(e){
                e.preventDefault();
                return false;
            });

不工作：

$('.test table').each(function(){ 

    console.log($(this).attr("summary"));  
    if ($(this).attr("summary") == "Table 2") {

        $(this).bind("dragover", function(e) {
                console.log($(this).attr("summary"));  
                e.preventDefault();
                return false;
        });

        $(this).bind("drop", function(e){
                console.log($(this).attr("summary"));  
                e.preventDefault();
                return false;
        });
    }
});

Answer 1

您必须取消mousedown事件：

$(this).on('mousedown', function(e) {
  e.preventDefault();
});

但如果您愿意，可以在HTML中执行：

<table id="s_2" summary="Table 2" onmousedown="return false"> </table>

Answer 2

试试这段代码。这样你也可以听到这个事件。

    $(this).on('mousedown', function(e) {
  event.stopPropagation();
});

有关stopPropogation here

的更多信息

在Div：Javascript中的一个表上防止拖放

2 个答案: