点击时我的div不会用js提交表单 [英] My div when clicked doesn't submit the form inside of it with js

问题描述

所以我无法解决的问题是我有一个php脚本，它可以从db中的聊天表中选择所有的东西，并把它变成一个'chaty'类的div。 chaty的有一个隐形的形式，其中有一个聊天索引值的输入。非常混乱。所以从根本上说，当我点击div chaty的一部分时，由于jquery onclick（仅输入无显示），因此提交的表单被提交。有一个聊天搜索，它使用ajax查询它接收提交上的每个关键更改的数据，然后按名称打印聊天。打印出的聊天内容不会在您点击时在其中提交表单。这里是前后的chaty div和js代码。
代码：
获取子目录的聊天：

 < div class =chaty> 
< form method =postaction =index.phpname =chat_loxclass =chat_loc> 
< input id =disspelltype =textname =chat_locyv 
 value =5e2dbe2be3b5927c588509edb1c46f7d> 
< / form> 
< div class =chatDescid =14025298> 
< div class =tit>造物主：< / div> 
< div class =iriss>< i id =close_chatnonclick =closeChat（14025298）
 class =material-icons> close< / i>< / DIV> 
 
< form action =mypage.phpmethod =post> 
 
 
< div class =authr_name>< button value =John Brownname =userlink
 class =subm_as_text>按钮>< / DIV> 
< / form> 
< div class =titd>< h3>说明< / h3>< / div> 
< div class =description_chat> jaames< / div> 
< / div> 
 
 
 < div class =chatname>< h3> james< / h3>< / div> 
 
 style =background：url 
（cimages / 1Hitsujib4cc344d25a2efe540adbf2678e2304c1501268980.jpg）; 
 background-size：cover; 
 background-重复：不重复; 
背景位置：50％50％;>< / div> 
< div class =underlie>< p>使用者：2< / p>< p>创建于：2017/07/28 07:09:40 pm< / p> 
< / div> 
 
< / div> 
  

没有获得提示的聊天：

 < div class =chaty> 
< form method =postaction =index.phpname =chat_loxclass =chat_loc> 
< input id =disspelltype =textname =chat_locyvalue =5e2dbe2be3b5927c588509edb1c46f7d> 
< / form> 
< div class =chatDescid =55876362style =display：none; width：0px;> 
< div class =tit>造物主：< / div> 
< div class =iriss>< i id =close_chatnonclick =closeChat（55876362）class =material-icons> close< / i>< / div> 
 
< form action =mypage.phpmethod =post> 
 
 
< div class =authr_name>< button value =John Brownname =userlinkclass =subm_as_text> Hitsuji< / button>< / DIV> 
< / form> 
< div class =titd>< h3>说明< / h3>< / div> 
< div class =description_chat> jaames< / div> 
< / div> 
 
 
 < div class =chatname>< h3> james< / h3>< / div> 
 
 background-repeat：no-repeat; 
 background-位置：50％50％;>< / div> 
< div class =underlie>< p>使用者：2< / p>< p>创建时间：2017/07/28 07:09:40 pm< ;; p>< ;; div;> 
 
< / div> 
  

JS：

 < （）; $ b $（this）.submit（）; 
 alert（submitted）; $ b $（。chat_loc）。 b}）; 
  

谢谢

解决方案

您必须使用活动授权 -

  $（document）.on（click，。chat_loc，function（）{
 $（this）。 submit（）; 
 alert（submitted）; 
}）; 
  

So the problem that I can not solve is that I have a php script that selects everything from the chat table in the db and makes it into a div with a class of 'chaty'. The chaty's have an "invisible" form which has a input with the value of the chat index. Quite confusing. So fundamentally when I click on part of the div chaty the form inside gets submitted because of a jquery onclick(only the input is displayed none). There is a chat search which uses an ajax query it receive data on each key change on the submit and then the chats are printed out by name. The chats printed out do not submit the form within them when you click. Here are the chaty divs before and after and js code. Code: Chat that gets submited:

<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>

Chat that does not get submited:

<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");
 });

Thank you

解决方案

You have to use event-delegation-

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

这篇关于点击时我的div不会用js提交表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！