使Jeditable能够处理新元素

时间:2011-11-27 11:51:29

标签: javascript jquery contextmenu jeditable filetree

我正在努力使Jeditable适用于使用this jquery文件树创建的新元素。

右键单击文件夹或文件,显示上下文菜单,单击上下文菜单中的“重命名”项后,我想激活Jeditable。

我正在使用此上下文菜单和this代码:

$(document).ready( function() {
$('#filetree').fileTree({
    root: '../../../',
    script: './connectors/jqueryFileTree.php',
    expandSpeed: 1000,
    collapseSpeed: 1000,
    multiFolder: true
}, function(file) {
    alert(file);
});

$.contextMenu({
    selector: 'ul.jqueryFileTree > li', 
    callback: function(key, options) {
        var m = "clicked: " + key;
        window.console && console.log(m);
        if(key == 'rename'){
            $('#1').trigger("edit1");
            }
    },
    items: {
        "rename": {name: "Rename", icon: "edit", accesskey: "r"},
        "cut": {name: "Cut", icon: "cut", accesskey: "c"},
        // first unused character is taken (here: o)
        "copy": {name: "Copy", icon: "copy", accesskey: "c o p y"},
        // words are truncated to their first letter (here: p)
        "paste": {name: "Paste", icon: "paste", accesskey: "cool paste"},
        "delete": {name: "Delete", icon: "delete"},
    }
});

/* Bind Jeditable instances to "edit" event. */


$("#1").editable("http://www.example.com/save.php", {
 event: 'edit1',

 });
});

});

但是不起作用,我已经在网上阅读(here)我应该使用.live(.on()没关系?因为我正在使用jquery 1.7.1)但我不喜欢不知道为什么,你能帮助我吗?

1 个答案:

答案 0 :(得分:1)

您可以使用.on()代替.live(),其工作方式类似于.delegate()方法。 live跟踪DOM的变化有点贵,因为.on().delegate()只是将事件简化为更高的元素,如documentbody,它必须迭代。 {1}}。

    $('.editableItem').live('click', function(){
        $(this).editable("http://www.example.com/save.php", {
     event: 'edit1',
     });
   });

<强> Why you have to use live?

因为动态插入到DOM中的元素不会自动附加到事件处理程序,因此必须使用live或插入元素后,可以使用{{3}手动将元素绑定到事件处理程序}

这里有一些有用的问题

.bind()

Difference between jQuery `click`, `bind`, `live`, `delegate`, `trigger` and `on` functions (with an example)?

Jquery live() vs delegate()