Question

我有問題重新綁定動態創建的對象，從前置。我嘗試了很多東西，但我只能解除綁定。請幫忙。

$(document).ready(function(){ 

$(".newdir").click(function(){ 
    $(".d-exp").prepend("<div id='new' class='fm-dir'><div class='exp-x'></div><div class='fm-name'><input class='nd-text' type='text'></div></div>"); 
    $(".newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity",".35"); 
    $(".newdir, .newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").unbind();  
}); 

$(".ribbon-menu").on("click", ".newfile", function(){ 
    $(".d-exp").prepend("<div id='new' class='fm-fn'><div class='exp-x'></div><div class='fm-name'><input class='nf-text' type='text'></div></div>"); 
    $(".newdir, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity",".35"); 
    $(".ribbon-menu").unbind(); 
}); 

$("div.d-exp").on("click", ".exp-x", function(){   
    $(".ribbon-menu").bind(); 
    $(".newdir, .newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity","1");  
    $("div#new.fm-dir, div#new.fm-fn").remove(); 
}); 

}); 

LIVE ANSWER http://jsfiddle.net/dC344/

Answer 1

嘗試：

$(document).on("click", ".newdir", function(){ 
    ... 
}); 

Answer 2

當您嘗試綁定回來，你需要從你指定哪個事件和處理函數

在這種情況下，只需要使用.one()而不是.on()和.unbind(),也可以使用.off()來解除綁定處理程序。

$(document).ready(function() { 

    $(".newdir").click(function() { 
     $(".d-exp").prepend("<div id='new' class='fm-dir'><div class='exp-x'></div><div class='fm-name'><input class='nd-text' type='text'></div></div>"); 
     $(".newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity", ".35"); 
     $(".newdir, .newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").unbind(); 
    }); 

    function addRibbonMenuHandler() { 
     $(".ribbon-menu").one("click", ".newfile", function() { 
      $(".d-exp").prepend("<div id='new' class='fm-fn'><div class='exp-x'></div><div class='fm-name'><input class='nf-text' type='text'></div></div>"); 
      $(".newdir, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity", ".35"); 
     }); 
    } 

    addRibbonMenuHandler(); 

    $("div.d-exp").on("click", ".exp-x", function() { 
     addRibbonMenuHandler(); 
     $(".newdir, .newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity", "1"); 
     $("div#new.fm-dir, div#new.fm-fn").remove(); 
    }); 

}); 

Answer 3

jQuery的支持live()之前將事件綁定到選擇，但Jquery 1.7後，live已被棄用。現在，你可以使用delegate或on將事件綁定到選擇器（如Jquery Document）

不過，我通常創建對象後綁定功能，如作爲

$(document).ready(function(){ 
    $("#main").click(function(){ 
     $("#main").append("<div class="new-div">Add new DIV</div>"); // Add new div in main 
     $(".new-div").on("click",doBindEvent); // Add click event into new div which function you defined 
    }); 
}); 

function doBindEvent(){ 
    // Do anything you want 
} 

Answer 4

隨着阿倫P約翰尼的幫助下，我能夠用一些解決我的問題的邏輯來修改腳本。我是jQuery的新手，雖然它可以在研究後將它拼合在一起... XD

$(document).ready(function() { 

function addRibbonMenuHandler1() { 
    $(".ribbon-menu").on("click", ".newdir", function() { 
     $(".d-exp").prepend("<div id='new' class='fm-dir'><div class='exp-x'></div><div class='fm-name'><input class='nd-text' type='text'></div></div>"); 
     $(".newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity", ".35"); 
     $(".ribbon-menu").unbind(); 
    }); 
} 

function addRibbonMenuHandler2() { 
    $(".ribbon-menu").on("click", ".newfile", function() { 
     $(".d-exp").prepend("<div id='new' class='fm-fn'><div class='exp-x'></div><div class='fm-name'><input class='nf-text' type='text'></div></div>"); 
     $(".newdir, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity", ".35"); 
     $(".ribbon-menu").unbind(); 
    }); 
} 

addRibbonMenuHandler1(); 
addRibbonMenuHandler2(); 

$("div.d-exp").on("click", ".exp-x", function() { 
    addRibbonMenuHandler1(); 
    addRibbonMenuHandler2(); 
    $(".newdir, .newfile, .paste, .copy, .cut, .rename, .delete, .fileinfo, .visit").css("opacity", "1"); 
    $("div#new.fm-dir, div#new.fm-fn").remove(); 
    $(".ribbon-menu").bind(); 
}); 

});