獲取jQuery的動態創建的兄弟輸入的值

我有一個jQuery數組的ajax返回值。然後，我使用.each（）將值附加到表中。我在每一行中包含一個按鈕來選擇特定的行。我如何獲得兄弟'editTemplateId'的值來選擇特定的行。獲取jQuery的動態創建的兄弟輸入的值

繼承人的代碼

AJAX調用

$.ajax({ 
     url: '/php-list/ajax/', 
     type: 'POST', 
     data: {method: 'loadTemplatesGrid'},  
     dataType: 'json',       
     success: function(data){     
      $("#templatesGridTable").find("tr:gt(0)").remove();        

      $.each(data, function(i, item) { 
       $('#templatesGridTable > tbody:last').append('<tr><td id="templateTitle"><h4>'+item.d+'</h4></td><td><form method="post"><input type="text" name="editTemplateId" id="editTemplateId" value="'+item.a+'"><input type="button" class="submit" type="button" id="editTemplate" name="editTemplate" value="Edit Template" onclick="editTemplateClick();"></form></td></tr>');     
      }); 
     } 
    });

jquery的（多個）功能

這一個只是警告空白消息

function editTemplateClick(){ 
    alert($(this).siblings('#editTemplateId').val()); 
}

這一個只是提醒頂行ID值

function editTemplateClick(){ 
    alert($('#editTemplateId').val()); 
}

這也只是提醒空白消息

function editTemplateClick(){ 
    alert( $(this).parent().find('#editTemplateId').val()); 
}

任何幫助非常感謝

來源

2014-09-12 Barry Watts

你得通過'$（本）'對象這是點擊！ – loveNoHate 2014-09-12 10:28:02

分享您的作品的小提琴鏈接，這可能會幫助我們更好地瞭解和調試您的問題 – karan3112 2014-09-12 10:28:07

繼承人一個小提琴http://jsfiddle.net/uapwn7cz/4/ – 2014-09-12 13:11:37

你使用了ID editTemplateId在for循環中，這將產生相同ID的多個inputs。

根據W3C規則，id應該是唯一的。

嘗試使用類而不是id，這可能會解決您的問題。

下面是一個更新fiddle

而且更安全側使用下面的代碼

//For dynamically added elements 
    $(document).on('click','.editTemplate', function() { 
     alert($(this).parent().find('.editTemplateId').val()); 
    });

來源

2014-09-12 10:32:36 karan3112

但類也將被複制。如果我可以讓每個班級都具有獨特性，那麼我可以讓每個班級唯一。該網站是內部網，所以W3C不是最重要的，只需要能夠獲得兄弟姐妹輸入的價值 – 2014-09-12 10:34:58

只需嘗試用類替換id。有了這個修復程序，你應該可以獲得兄弟輸入的值。 – karan3112 2014-09-12 10:36:49

將ID更改爲一個類，並提醒還返回最後一個附加到表的數據，現在有多個隱藏的輸入，其中有一類'editTemplateId' – 2014-09-12 10:40:19

$(document).ready(function() { 
    $('#templatesGridTable').click(function (event) { 
    alert($(event.target).prev().val()); 
    }); 
});

找到自己的答案

來源

2014-09-12 13:34:53

獲取jQuery的動態創建的兄弟輸入的值

回答

相關問題