我有一个动态表,其中一列设置为具有可编辑元素。呈现页面后,我可以编辑第一行中的条目,但此后没有其他行具有id:name的事件侦听器。我不明白为什么。这是我的代码:
$(document).ready(function(){
//toggle `popup` / `inline` mode
$.fn.editable.defaults.mode = 'popup';
//make name editable
$('#name').editable();
... });
<tbody>
<?php foreach ($action_lists as $list_item) {
echo "<tr>";
echo "<td> <a href=\"#\" id=\"name\" data-pk=\"{$list_item["ActionList"]["list_index"]}\" data-url=\"/post\" data-type=\"text\" data-placement=\"right\" data-title=\"Enter new name.\" class=\"editable editable-click\">{$list_item["ActionList"]["name"]}</a></td>";
echo "</tr>";
}?>
</tbody>
答案 0 :(得分:1)
$('#name')将根据id查询文档,因此它将返回第一个匹配的元素,因此只需使用类名而不是id并使用$(“。name”),然后它将适用于所有元件
答案 1 :(得分:0)
我认为不是从ID调用它,而是需要使用类名调用它,同一个类可以应用于每个列/行,并且点击每个列/行单击事件将触发。之后使用“$(this)”将对您有所帮助。
答案 2 :(得分:0)
尝试使用class而不是id
$(document).ready(function(){ //toggle `popup` / `inline` mode $.fn.editable.defaults.mode = 'popup'; //make name editable $('.name').editable(); ... }); <tbody> <?php foreach ($action_lists as $list_item) { echo "<tr>"; echo "<td> <a href=\"#\" class=\"name\" data-pk=\"{$list_item["ActionList"]["list_index"]}\"> data-url=\"/post\" data-type=\"text\" data-placement=\"right\" data-title=\"Enter new name.\" class=\"editable editable-click\">{$list_item["ActionList"]["name"]}</a></td>"; echo "</tr>"; }?> </tbody>
这应该可以正常使用