Question

这是我的代码，我尝试使对话框可拖动，并且其上的按钮失去了它的：活动功能。我为draggable添加了'handle'选项，没用。我做错了什么？

function Alert(text){
    var $Alert = $('<div/>').attr('id', 'Alert');
    $('body').append($Alert);

    $Alert.draggable({handle:"#Alert"});

    $Alert.append($('<div/>').attr('id', 'AlertText').text(text));
    $Alert.append($('<br/>'));
    $Alert.append($('<div/>').attr('id', 'AlertButton').text('OK'));

    $('#AlertButton').click(function(){
        $Alert.remove();
    });
}

Answer 1

等等......您使用$('<div/>')选择了什么？也许你应该使用div ID或类;）

Answer 2

抱歉，伙计们，我是新人，所以当时我无法自言自语。我试图发表评论，但显然没有显示。我自己找到了答案，stackoverflow.com甚至可以为我保存答案，所以这里是：虽然我在发布之前搜索了google和StackOverflow很多，但我在这里找到了答案。 Jquery Draggable UI overrides normal browser behavior for HTML elements inside draggable-enabled div

您可以像这样禁用内部拖动：

$("#popup div").bind('mousedown mouseup', function(e) {
  e.stopPropagation();
});

event.stopPrpagation（）停止点击该内部的点击向上冒泡到绑定了它的拖动事件的外部。由于事件永远不会到达那里，因此那些拖动事件处理程序不会干扰。您可以在创建可拖动之前或之后运行此代码，它将以任何方式工作。

这是我当前的代码，以防有人帮助：

function Alert(text){
    var $Alert = $('<div/>').attr('id', 'Alert');
    $('body').append($Alert);

    /*optional, requires jQuery ui .draggable()*/
    $Alert.draggable({handle:"#Alert"});

    $Alert.append($('<div/>').attr('id', 'AlertText').text(text));
    $Alert.append($('<br/>'));
    $Alert.append($('<div/>').attr('id', 'AlertButton').text('OK'));

    $("#AlertButton").bind('mousedown mouseup', function(e) {
        e.stopPropagation();
    });

    $('#AlertButton').click(function(){
        $Alert.remove();
    });
}

当使用jquery ui draggable时，：活动代码不起作用

2 个答案: