我点击div时没有提交表单里面的js

所以我无法解决的问题是，我有一个PHP脚本，从db中的聊天表中选择所有的东西，并使其成为一个div一班'chaty'。 chaty的有一个“隐形”的形式，其中有一个聊天索引值的输入。非常混乱。所以从根本上说，当我点击div chaty的一部分时，由于jquery onclick（只有输入不显示任何内容）而被提交。有一个聊天搜索，它使用ajax查询它接收提交上的每个关键更改的数据，然后按名称打印聊天。打印出的聊天内容不会在您点击时在其中提交表单。这里是前后的chaty div和js代码。代码：聊天中得知被submited：我点击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>

聊天，不得到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"); 
});

谢谢

来源

2017-08-17 Hakorou

你必须使用event-delegation -

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

来源

2017-08-17 19:23:15

为什么？如果div是在js实例化之后创建的，但是它表示第一个HTML块工作，第二个块由PHP生成（这会在浏览器甚至看到它之前生成标记），这是有道理的。 – Octopus

这就是使用事件委托的原因（在动态生成的元素上应用事件）。请检查链接 –

尝试从。对swiching为了活着。如果它有效，可能意味着您在元素在页面上之前初始化此事件处理程序。 On只会注册现有元素的事件。 Live将确保所有与选择器匹配的事件被调用。即使是未来登记的元素。这里更多的是这个。 http://api.jquery.com/live/

来源

2017-08-17 19:20:26 Pbrain19

另一种选择是将事件附加到已存在的父元素。这个事件会冒泡到它。我从来不知道活的api。 +1 – Silencer310

从jQuery 1.7开始，不推荐使用.live（）方法。使用.on（）和使用.live（）如果他最近使用了任何东西都会有同样的效果;我们使用jQuery 3.2。 –

您可以尝试通过封装的jquery准备函数内部的事件，当DOM加载那么事件应用到特定元素。

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

或者你也可以使用上面提到的函数回答。

来源

2017-08-17 19:26:59

我点击div时没有提交表单里面的js

回答

相关问题