Question

我的目标是使用jQuery UI使元素可拖动，如果它存在某个类。在dblclick上使用toggleClass添加该类。

添加＆＃39; draggable＆＃39;双击时右侧元素的类：

    $("article.spread").dblclick(function() {
        $(this).toggleClass("draggable");
    });

然后我用它来使元素可拖动：

    $( ".draggable" ).draggable();

只有它不起作用。 toggleClass是成功的，但它不可拖动。

Answer 1

它无效，因为你声明$（“。draggable”）。draggable（）然后将一个类添加到一个元素。

$（“。draggable”）。draggable（）只会使页面上的当前元素具有可拖动类可拖动。

你可以试试像

这样的东西

$("article.spread").dblclick(function() {
     if ($(this).data('draggable')) {
        $(this).draggable({ cancel: "div" });
        $(this).data('draggable', false);
     }
     else {
        $(this).draggable();
        $(this).data('draggable', true);
     }
});

Answer 2

您在元素上触发第一个drggable后动态添加该类，并且不会生成evalueted。

您可以在添加类时添加drggable，如果已经附加了类，则启用/禁用它：

$("article.spread").dblclick(function () {
    $(this).toggleClass("draggable");
    if ($(this).data('draggable')) {
        $(this).draggable('option', 'disabled') ? $(this).draggable('enable') : $(this).draggable('disable');
    } else {
        $(this).draggable();
    }
});

演示：http://jsfiddle.net/IrvinDominin/8J7sq/

在toggleClass之后使元素可拖动

2 个答案: