如何將多個動態元件的一個元件影響

http://jsfiddle.net/SergeyKozlov/tewyg2js/3/如何將多個動態元件的一個元件影響

我使用動態插入HTML代碼中使用按鈕事件：

$("#NewItemImg").click(function(e) { 
    e.preventDefault(); 
    itemCount++; 

    var element = $("\ 
        <div class=\"portlet ui-widget ui-widget-content ui-helper-clearfix ui-corner-all\">\ 
         <div class=\"portlet-header ui-widget-header ui-corner-all\">img " + itemCount + "\ 
          <span class='ui-icon ui-icon-closethick portlet-close'></span>\ 
         </div>\ 
         <div class=\"portlet-content\">\ 
          <div class=\"form-group\">\ 
           <input type=\"text\" class=\"form-control\" name=\"article[body][][img]\" id=\"ImageURL\" placeholder=\"Image URL\">\ 
          </div>\ 
          <button id=\"SetImageURL\" type=\"button\" class=\"btn btn-default\">Submit</button>\ 
          <img id=\"PanelNewImageURL\" src=\"http://imgde.me/508f93cfb59b5.jpg\" alt=\"2014-12-10T18:04:41.762Z\" title=\"2014-12-10T18:04:41.762Z\" onerror=\"imgError(this);\">\ 
         </div>\ 
        </div>\ 
    ");

然後我嘗試使用以下代碼來刪除新的動態元件：

$("body").on('click', '.column .portlet-close', function() { 
    $(this).closest(".portlet").remove(); 
});

在這種情況下，它的工作原理。問題是如何影響多個動態元素中的一個元素。

$("body").on('click', '.column #SetImageURL', function() { 
    //e.preventDefault(); 
    // itemCount++; 
    $("#PanelNewImageURL").show(); 
    $("#ImageURL").hide(); 
});

當我使用此代碼時，當您獲得任何按鈕，並只對第一個行爲。

來源

2015-02-10 Sergey Kozlov

'id' ** **必須爲每一個元素是唯一的。這就是爲什麼你的代碼只對第一個元素起作用，因爲'id' – 2015-02-10 21:04:57

*「如何影響多個動態元素中的一個元素」* - 如何*什麼*？ – nnnnnn 2015-02-10 21:15:45

您會看到此行爲，因爲id屬性必須是唯一的，但是您使用多個「SetImageURL」實例作爲ID。當jQuery選擇器在其中包含一個id引用時（就像它在這裏：on('click', '.column #SetImageURL' . . .），它僅對具有該id的第一個匹配元素起作用，並忽略任何其他具有該元素的元素。

因此，您需要找出一種方法使其與純類選擇器一起工作，或者使id值保持唯一併在選擇器中包含這些唯一的id值。我會採用第一種方法。。。不管怎樣，無論如何，你應該確保你的id值是唯一的。 :)

編輯：

再次在你的代碼看，試試這個：

$("body").on('click', '.column .btn-default', function() { 
    //e.preventDefault(); 
    // itemCount++; 
    $(this).siblings("img").show(); 
    $(this).parent().find(".form-control").hide(); 
});

來源

2015-02-10 21:05:56 talemyn

如何將多個動態元件的一個元件影響

回答

相關問題