Javascript 如何在页面之间导航后停止jquery mobile中的重复数据

我正在jQuery Mobile中创建一个聊天应用程序。问题是，当您在页面之间导航并在提交数据时返回聊天页面时，数据会根据在其他页面之间导航的次数重新发送

当我执行整页刷新时，数据只根据需要发送一次

我已经尝试将

数据ajax=false

添加到链接（按钮）的

href

，但仍然不起作用

html代码：

<form id="form_message_user" method="post"    
action="#user_requestmoreinfo_page
  ">
  <div data-inset="true">
 <label for="requestmessage" class="ui-hidden-accessible"></label>
     <textarea cols="40" rows="6" name="requestmessage" 
 id="text_user_message" placeholder="Type message to send "></textarea>
  </div>
  <input type="submit" value="submit" id="submitmessage" />

 </form>

成功后，console.log（）将根据进入页面之前的页面导航次数显示json数据（#user_requestmoreinfo_page）

例如：

---

如果我必须在其他页面之间导航3次，console.log（）将显示3次输出

，我猜每次处理#user_requestmoreinfo_页面事件时，您都将事件处理程序绑定到#form_message_user元素。我会尝试添加

$('#form_message_user').off('submit');

之前

$('#form_message_user').on('submit', function(e){
    // function body continues

您也可以尝试使用。一：

$('#form_message_user').one('submit', function(e){
    // function body continues

根据文档，这应该与.off（）后跟.on（）具有相同的效果：

---

我能想到两个原因让你体验到这种行为

1） 代码乘法。将代码绑定到

pagecreate

，而不是

pageshow

，因为每次显示页面时都会触发后一个事件，从而复制提交代码并导致多个事件

2） 页面复制。这是jQM中的一个众所周知的错误。简而言之，在某些情况下，第一个页面（及其表单）在DOM中是重复的。要修复它，请使用属性

数据url

描述HTML文档的路径，并将其放置在

页面div

中。示例代码：

<div data-role="page" data-url="mysite/path/index.html" id="user_requestmoreinfo_page">

下面是对代码的重新修改，添加了页面导航按钮：

示例代码：

$（文档）.on（'pagecreate'，'user#requestmoreinfo_page'，函数（e）{
$（'form#message_user'）。关于（'submit'，函数（e）{
//取消默认操作(https://api.jquery.com/event.preventdefault/)
e、 预防默认值（）；
//var id_from=localStorage.loggedin_id；
//var id\u to=localStorage.user\u schools\u id；
var message=$（“#text_user_message”）.val（）；
//证实
如果（消息==“”）
警报（“请输入消息”）；
//通过Ajax调用将数据发送到服务器
//action是我们想要调用的功能，outputJSON是我们的数据
警惕（“谢谢你的评论”）；
$.ajax({
url:'127.0.0.1/php/send.php'，
数据：{
讯息:讯息,，
id_from:id_from，
id_to：id_to
},
键入：“post”，
异步：“true”//
信息：

第二页


第三页

reload

仅在“url”参数为url（）时有效。请发布HTML表单代码和jQuery提交代码。在将ID作为引用处理时，是否有方法确保重新加载（#…）添加事件侦听器时，将代码包装在

pagecreate

中，而不是

pageshow

。如果出现jqm页面复制错误，这将不起作用，因为DOM中会有两个具有相同ID的表单。感谢您的解决方案，它现在可以工作了。我添加了、.off（提交）和.one（提交）。我发现的另一个解决方案是添加pageinit而不是PageShow。奇怪的是，当OP接受我的答案时，为什么我的答案被否决了。@GEOFFREYMWANGI，如果我的答案可以接受，我会得到赏金吗？谢谢！

$('#form_message_user').one('submit', function(e){
    // function body continues

<div data-role="page" data-url="mysite/path/index.html" id="user_requestmoreinfo_page">