没有 x 可编辑表元素的事件侦听器

No event listener for x-editable table elements

本文关键字:事件 侦听器 元素 编辑 没有      更新时间:2023-09-26

我有一个动态表,其中一列设置为具有可编辑的元素。呈现页面后,我可以编辑第一行中的条目,但此后其他行都没有 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>

$('#name') 将根据 id 查询文档,因此它将返回第一个匹配的元素,因此只需使用类名而不是 id 并使用 $(".name"),然后它将应用于所有元素

我认为不是

从 ID 调用它,而是需要使用类名调用它,相同的类可以应用于每列/行,单击每列/行单击将触发事件。之后使用"$(this)"将对您有所帮助。

尝试使用 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>

这应该正常工作