Question

的index.php ：

    <script>
$(document).ready(function(){
  $("form").submit(function(){
   var str = $(this).serialize();
  $.ajax({
     type: "POST",
     url:"do.php",
     data: $("form").serialize(), 

  });
  return false;
 });
});
</script>

    <form action='do.php' method='post' id='toDo' name='toDo'>
        <input type='hidden' name='okok' value='one.txt'>
        <button type='submit' class='theButton'></button>
    </form>

    <form action='do.php' method='post' id='toDo' name='toDo'>
        <input type='hidden' name='okok' value='two.txt'>
        <button type='submit' class='theButton'></button>
    </form>

在上面的代码中，有两种不同的形式 - 每种形式都有相同的名称。每个表单都有一个input hidden标记，其中包含与目录中特定文件相关的唯一值。

如果用户点击任何表单中的提交按钮，则用户点击提交按钮的格式中的input hidden标记的值将被发送到文件 do。 PHP 即可。

由于input hidden标记的值是文本文件的名称，一旦将其发送到 do.php （可以在下面看到），该文件的内容将检索（内容都是数字）。从文本文件（这是一个数字）检索的值将增加1.增加1的新值将重写旧值并存储在文本文件中。

do.php ：

<?php
    $filename = $_REQUEST[okok];
    $content = file_get_contents($filename);
    preg_match("#\d+#", $content, $before_editing);
    $number_before = $before_editing[0];
    file_put_contents($filename, ++$number_before);

    $content = file_get_contents($filename);
    preg_match("#\d+#", $content, $after_editing);
    $number_after = $after_editing[0];   
?>

在没有我包含的AJAX脚本的情况下，代码完美运行。使用AJAX脚本，只有底部表单的值将被发送到 do.php - 所以如果我在第一个表单上单击提交，而不是发送值 one.txt ，它会发送值 two.txt 。

如何修复AJAX以使其正常工作？

Answer 1

问题在于：

data: $("form").serialize(),

此代码查找并序列化DOM中的所有表单元素，而不仅仅是您想要的表单元素。快速修复：

$(document).ready(function(){
    $("form").submit(function(){
        var str = $(this).serialize();
        $.ajax({
            type: "POST",
            url:"do.php",
            data: $(this).serialize(), // serialize only clicked form, not both
        });
        return false;
    });
});

请注意，您的代码中存在各种安全问题，包括路径遍历漏洞。

如何通过AJAX从具有多个表单的页面上的一个表单发送数据？

1 个答案: