Question

所以我无法解决的问题是我有一个php脚本，它从数据库中的聊天表中选择所有内容，然后将其变成一个带有＆＃39; chaty＆＃39;类的div。这个chaty有一个＆＃34;隐形＆＃34;具有带有聊天索引值的输入的表单。相当混乱。所以从根本上说，当我点击div chaty的一部分时，由于jquery onclick（只有输入没有显示），内部的表单才会被提交。有一个聊天搜索，它使用ajax查询，它接收提交中每个键更改的数据，然后按名称打印聊天。当您点击时，打印出的聊天记录不会在其中提交表单。这里是前后的chaty div和js代码。码：提交的聊天内容：

<div class="chaty">
<form method="post" action="index.php" name="chat_lox" class="chat_loc">
<input id="disspell" type="text" name="chat_locy" v 
value="5e2dbe2be3b5927c588509edb1c46f7d">
</form>
<div class="chatDesc" id="14025298">
<div class="tit">Creator: </div>
<div class="iriss"><i id="close_chatn" onclick="closeChat(14025298)" 
class="material-icons">close</i></div>

<form action="mypage.php" method="post">


<div class="authr_name"><button value="John Brown" name="userlink" 
class="subm_as_text">Hitsuji</button></div>
</form>
<div class="titd"><h3>Description</h3></div>
<div class="description_chat">jaames</div>
</div>


 <span onclick="openChat(14025298)">☰</span>
 <div class="chatname"><h3>james</h3></div>
 <div class="chatback" 
 style="background:url
 (cimages/1Hitsujib4cc344d25a2efe540adbf2678e2304c1501268980.jpg);  
 background-size: cover;
 background-repeat: no-repeat;
 background-position: 50% 50%;"></div>
 <div class="underlie"><p>Users: 2</p><p> Created: 2017/07/28 07:09:40pm</p>
 </div>

 </div>

未提交的聊天内容：

<div class="chaty">
<form method="post" action="index.php" name="chat_lox" class="chat_loc">
<input id="disspell" type="text" name="chat_locy" value="5e2dbe2be3b5927c588509edb1c46f7d">
</form>
  <div class="chatDesc" id="55876362" style="display: none; width: 0px;">
<div class="tit">Creator: </div>
  <div class="iriss"><i id="close_chatn" onclick="closeChat(55876362)" class="material-icons">close</i></div>

  <form action="mypage.php" method="post">


  <div class="authr_name"><button value="John Brown" name="userlink" class="subm_as_text">Hitsuji</button></div>
</form>
<div class="titd"><h3>Description</h3></div>
<div class="description_chat">jaames</div>
</div>


<span onclick="openChat(55876362)">☰</span>
<div class="chatname"><h3>james</h3></div>
<div class="chatback" style="background:url(cimages/1Hitsujib4cc344d25a2efe540adbf2678e2304c1501268980.jpg);  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;"></div>
<div class="underlie"><p>Users: 2</p><p> Created: 2017/07/28 07:09:40pm</p></div>

</div>

JS：

$(".chat_loc").on("click",function() {
  $(this).submit();
  alert("submitted");
 });

谢谢

Answer 1

尝试从.on切换到生活。如果它工作，它可能意味着您在页面上的元素之前初始化此事件处理程序。 On将仅注册现有元素的事件。 Live将确保为所有与选择器匹配的事件调用事件。即使是将来注册的那些元素。这里有更多内容。 http://api.jquery.com/live/

Answer 2

您必须使用event-delegation -

$(document).on("click",".chat_loc",function() {
  $(this).submit();
  alert("submitted");
});

Answer 3

您可以尝试在加载DOM时将事件封装在jquery ready函数中，然后将事件应用于特定元素。

  $(function(){
    $(".chat_loc").on("click",function() {
      $(this).submit();
      alert("submitted");
    });
  });

或者您也可以使用上面提到的功能答案。

单击时我的div不会使用js在其中提交表单

3 个答案: