Question

我正在研究Drag＆amp;使用JQuery UI删除Builder。我想要做的是，当我将鼠标悬停在任何可拖动元素上时，会出现一个十字，并且在点击该十字时，需要删除该元素。这是我的JQuery代码，用于创建可拖动元素：

var postfix = '<i class="fa fa-times"></i>';
$(".buildbutton").click(function() {
    var id = this.id;
    if (id === 'label') {
        var elemHtml = '<div class="draggable"><label contenteditable="true" class="draggable" id="label' + labelCount + '">Text</label> ' + postfix + '</div>';
        $("#canvas").append(elemHtml);
        label++;
    }
    $(function() {
        $( ".draggable" ).draggable({containment: "#canvas"}).resizable();
    });
    return false;
});

用于绑定Remove事件的JQuery代码：

$(".draggable").on("click", "i", function(){
     alert("going to remove this element");
});

但Click事件无效，因为每当我点击它时，可拖动元素就会触发它自己的事件。

如何使此Cross可点击。？

Answer 1

这是工作代码：

    14:34:56.600

    14 = hour
    34 = minute
    56 = seconds
    600 = milliseconds

Answer 2

您遇到的问题与此处相同：jQuery .on('click') does not work with jQuery UI draggable

这应该有效：

$(".draggable i").on("click", function(){
     alert("going to remove this element");
});

这是一个有效的jsFiddle

如何在可拖动元素中创建元素可点击？

2 个答案: