Question

我是jQuery的新手。我试图在每个动态添加的行上调用Blur函数，并将两个文本框的每一行的值发送给PHP。
对于第一行，它可以工作但动态添加行，它不起作用。
我的守则如下：
HTML和Jquery：

 <!doctype HTML>
    <html>
    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    </head>
    <script type="text/javascript">
    var rowCount = 1;
    function addMoreRows(frm) {
    rowCount ++;
    var recRow = '<p id="rowCount'+rowCount+'"><tr><td><input name="" type="text" id="co_name" size="17%"  maxlength="120" /></td><td><input name="" type="text"  id="co_qty" maxlength="120" style="margin: 4px 5px 0 5px;"/></td></tr> <a href="javascript:void(0);" onclick="removeRow('+rowCount+');">Delete</a></p>';
    jQuery('#addedRows').append(recRow);
    }

    function removeRow(removeNum) {
    jQuery('#rowCount'+removeNum).remove();
    }
    </script>
    <body>
    <table rules="all" style="background:#fff;">
    <tr>
    <td style="font-size:14px;" >Name</td>
    <td style="font-size:14px;" >Email</td>

    <td><span style="font:normal 12px agency, arial; color:blue; text-decoration:underline; cursor:pointer;" onclick="addMoreRows(this.form);">
    Add More
    </span>
    </td>
    </tr>
    <tr id="rowId">
    <td><input name="" type="text"  id="co_name" value="" size="17%"/></td>
    <td><input name="" type="text" id="co_qty" value="" /></td>

    </table>
    <div id="addedRows"></div>
    </td>
    </tr>
    <script>
    $(document).ready(function(){
        $('#co_qty').on('blur',function () {
    var username = $('#co_name').val(); 
     var password = $('#co_qty').val(); 
    $.ajax({
             type: "POST",
             url: "blur.php",
             data: {'title':username ,'title1':password},
             success: function(msg) {
      alert(msg)             }

    }); 
     });
    });

    </script>
    </body>
    </html><br>

blur.php

$var=$_POST['title'];
$var1=$_POST['title1'];
echo $var."Success!".$var1;

我没有得到它。请建议我。谢谢。

Answer 1

使用on()绑定DOM上动态添加的元素。

因为当DOM准备就绪时，它没有那些元素，当你动态添加它们时，DOM不理解它们。

$('body').on('blur','.co_qty', function () {
   //Your code
});

我可以看到你有多个具有相同身份#co_qty的元素（文本框），这会导致问题。

您需要使用.co_qty来应用动态添加的元素。

jQuery：Blur函数不会调用每个动态添加的行

1 个答案: