Question

我在ajax成功后追加新行后，无法选择此行（我使用 toggleClass（）以及 hover（））。谷歌搜索之后是因为事件没有绑定，应该使用 on（）而不是 click（），但它仍然是相同的

$("#simpan").on("click",function(){
              var nim=$("#nim").val();
              var nama=$("#nama").val();
              var alamat=$("#alamat").val();


              $.ajax({
                  type:"post",
                  url:"data.php?action=getdata",
                  data:"nim="+nim+"&nama="+nama+"&alamat="+alamat,
                  success:function(data){
                       $("table").append(data);
                       resetForm();
                  }
              });

          });

你有解决方案吗？

更新这是行

的事件处理程序

$("tr").not(":first").click(function(){
     $("tr").not(this).removeClass("selected");
     $(this).toggleClass("selected");
});

我的桌子

<table id="table" border="1">
      <tr>
          <td>Nim</td>
          <td>Nama</td>
          <td>Alamat</td>
      </tr>

      <?php
        include "db.php";
        $result=mysql_query("SELECT * FROM mahasiswa");
        while($mahasiswa=mysql_fetch_array($result)){
      ?>

      <tr>
         <td><?php echo $mahasiswa["nim"]; ?></td>
         <td><?php echo $mahasiswa["nama"]; ?></td>
         <td><?php echo $mahasiswa["alamat"]; ?></td>
      </tr>

      <?php
        } 
      ?>

    </table>

“simpan”是一个按钮，单击该按钮时，表单中的数据将使用ajax保存到数据库中，成功时，数据将附加到表中

echo "
      <tr>
        <td>$_POST[nim]</td>
        <td>$_POST[nama]</td>
        <td>$_POST[alamat]</td>
      </tr>
    ";

Answer 1

$(document).on("click", "#simpan", function(){
    var nim=$("#nim").val();
    var nama=$("#nama").val();
    var alamat=$("#alamat").val();


    $.ajax({
        type:"post",
        url:"data.php?action=getdata",
        data:"nim="+nim+"&nama="+nama+"&alamat="+alamat,
        success:function(data){
        $("table").append(data);
        resetForm();
    }
});

Answer 2

对于on()的动态添加元素语法，如：

$(staticPanentElement).on(eventName, target, handlerFunction);

其中staticPanentElement表示指向未动态创建且包含target的项目的任何有效选择器。

在您的代码中，您似乎使用的是具有相同id=simpan的多个行且这是不可接受的。

动态追加html后无法选择jquery行

2 个答案: