javascript - Ajax 自定义表单内嵌消息

标签 javascript php ajax

我在许多表单中使用ajax,问题是当我输入其中一个表单时,返回的消息显示在所有表单中,有一种方法可以避免这种情况,以便只在表单中显示消息发送而不是其他人?

这里是输入html适配:

 <!-- FORM 1-->
 <form name="name" action="form.php" method="POST" id="contact1">
 <li class="text-info">Name</li>
 <select name="age">
 <option value="Sam">Sam</option>
 <option value="Mike">Mike</option>
 </select>
 <input type="submit" name="submit" value="namevalue">
 </form>

    <div id="result1"></div>

<!-- FORM 2-->
<form name="likes" action="form.php" method="POST" id="contact2">
<ul>
<li class="text-info">Interests</li>

<input type="checkbox" name="interests[]" value="play_soccer">Play Soccer</input>

<input type="checkbox" name="interests[]" value="play_golf">Play Golf</input>

 <input type="submit" name="submit" value="gamevalue">
 </form>

<div id="result2"></div>

ajax的js是:

<script type="text/javascript">
$(document).ready(function() {
  $("form").submit(function() {
    // Getting the form ID
    var formID = $(this).attr('id');
    var formDetails = $('#'+formID);
    $.ajax({
      type: "POST",
      url: 'form.php',
      data: formDetails.serialize(),
      success: function (data) {
        // Inserting html into the result div
        $('#results1').html(data);
        $('#results2').html(data);


      },

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

因此,在 form.php 中,当单独提交表单时,每个表单都会发送带有简单回显的消息,通知其已更新。

欢迎任何帮助,谢谢

最佳答案

  • 如果您不做任何更改,只需添加以下条件和成功响应即可

if(formID=='contact1') $('#results1').html(数据); else if(formID=='contact2') $('#results2').html(数据);

关于javascript - Ajax 自定义表单内嵌消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55603097/

相关文章:

php - 由于目标机器主动拒绝,无法建立连接。 [tcp ://127. 0.0.1:6379] - codeigniter

javascript - 如何通过 Jquery 和 ajax 从响应中下载 JSON 文件

javascript - 在指令的链接函数中修改事件中的范围变量

javascript - 在 Typescript 中使用外部 JS-Library(基本原语图)

javascript - Branch.io 分享表消息

java - 如何管理 Apache Web 服务器和 Google App Engine 之间的 HTTP 通信?

javascript - 无法使用 javascript 在页面上使用多个表单来定位 input[type=file]

php - 将 mysqli 转换为 pdo bind_all

ajax - session 无效后不会触发 ajax 操作

javascript - 如何删除数组中的数组? json 的 AJAX 数据