我點擊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

回答

相關問題