下面代码中的第一个div
显示一个学院名称,点击它会触发函数display_people()
。该功能用于显示/隐藏该学院的人员。这些人的名字包含在初始设置为的div
标签内。id="college_people"
display
none
现在,当点击一个人名时,它会触发函数display_chat_box()
,用于显示该人的聊天框。
当我们点击这个人的名字时,聊天框就会出现,并且没有让聊天框消失的规定。但人名本身可以通过该功能隐藏或显示display_people()
。显然,当人名被隐藏时(点击大学名称,从而使用toggle()
jQuery 隐藏人名),聊天框消失了,这是我不想要的。
可能是因为单击人名时会出现聊天框。当这个名字消失时,它的onclick
功能也消失了,因此离开了聊天框。我只希望聊天框留在那里,而不是与人名一起消失。
有什么办法我可以做到这一点?
<div id='state_college_container' onclick='display_people()'>
<span id='state_college_span'>
College name
</span>
</div>
<div id='college_people' style='display:none'>
<div id='college_people_container' onclick='display_chat_box()'>
<span id='college_people_span'>
People name
</span>
</div>
</div>
function display_people() {
$("#college_people").toggle();
}
function display_chat_box() {
$(".chat_box").show();
}
聊天框位于类名下的一个完全独立的 HTML 文件中chat_box
。它不是任何其他元素的后代。
这是聊天框的 HTML 代码。
<div class="chat_box">
<div id="chat_box_bar">
<span id="chat_with">Your name</span>
<span id="close_chat" onclick="close_chat_box()">X</span>
</div>
<div id="previous_chat1" >
<span> Hi, how are you?</span>
</div>
<div id="textarea_container">
<textarea onkeypress="return detectEnter(event)" id="chat_content1" name="posted_content1"></textarea>
</div>
</div>