자바 스크립트로 브라우저 채팅 상자 표시 및 숨기기

Question

자바 스크립트로 브라우저 채팅 창을 만들고 있습니다. 채팅 표시 줄을 클릭 할 때 채팅을 표시하고 숨기는 기능을 실행하고 싶은데 클릭 할 때 기능을 실행하지 않으려 고합니다. .chat_txt 또는 .chat_new_input

가능합니까?

<div id="chat_system_msg_lp" class="chat_box clickable_box hidden_box"> 
    <div id="chat_system_msg_nick" class="chat_name">system_msg</div> 
    <ul id="chat_system_msg_txt" class="chat_txt"> 
     <li id="46">Hi visitor. We suggest you to sign in/sign up in order 
     to have all the benefits from Live-Pin </li> 
    </ul> 
    <form class="chat_new_message" name="new_msg"> 
     <input type="text" placeholder="Enter your message..." 
     class="chat_new_input"> 
    </form> 
</div> 

Answer 1

사용 당신이의 jQuery 1.7+에 있다면

$('body').on('click', '.hidden_box:not(.chat_box)', function() { showChat(this); }); 

: 여기

//JavaScript Show/Hide Function 
$('.hidden_box').live("click", function(){ showChat(this); }); 
$('.active_box').live("click", function(){ hideChat(this); }); 

$('.chat_txt').click(function(event) { 
    event.preventDefault(); 
}); 

은 DIV의 구문입니다. 이전 jQuery :

$('body').delegate('.hidden_box:not(.chat_box)', 'click', function() { showChat(this); }); 

물론 다른 하나에 대해서도 마찬가지입니다.

편집 — 더 자세히 설명해야합니다. .live() API는 좋은 아이디어였으며, 약 1.4 이후로 .delegate() 기능이 분명히 선호되었습니다. 같은 셀렉터를 사용하여 여전히 "라이브"로 할 수 있지만, 정말로 오래된 jQuery 버전을 사용하지 않는 한 그렇게하지 마십시오.