Question

我有这段代码。它将动态生成多个表单。我想问一下如何写Jquery代码只发布选中的表单。 $ day实际上来自数据库，为了简单起见，我只是将它分配到6。

PHP

<?php

$day = 6;

for($i=1; $i<= $day ;$i++){

    echo "<div class='item'>";
    echo "<form class='itineraryForm' id='itineraryForm$i'  method = 'post'>";
    echo "<table>";
    echo "<tr>";
    echo "<th>Time</th>";
    echo "<th>Activities</th>";
    echo "</tr>";
    echo "<tr>";
    echo "<td>";
    echo "<input type='text' class='i_field' name='time[]' value='' />";
    echo "</td>";
    echo "<td>";
    echo "<input type='text' class='i_field' name='activities[]' value='' />";
    echo "</td>";
    echo "</tr>";
    echo "</tbody>";
    echo "<input type='image' id='i_save_btn' src='img/save.png' value='SAVE' align='right'/>";
    echo "</table>";
    echo "</form>";
}
?>

JS

$().ready(function () {
    $("#i_save_btn").click( function(e){
        $.post('inc/process.php', $(".itineraryForm").serialize(), function(data) {});
    });
});

Answer 1

使用下面的代码。

致电Event Delegation

事件委托允许我们将单个事件监听器附加到父元素，将为匹配a的所有后代触发选择器，无论这些后代现在存在还是被添加到将来

- ＆GT;使用i_save_btn作为课程。总是应该是独一无二的。

$(document).ready(function () {
  $(document).on('click',".i_save_btn",function(e){
    e.preventDefault();
    $.post('inc/process.php', $(this).parents('form').serialize(), function(data) {});
   });
});

检查DEMO

Jquery发布动态表单

1 个答案: