W3Schools 웹 사이트에서 Ajax 라이브 검색 기능을 사용하고 있습니다. #livesearch가 결과 div를 사용자가 클릭하면 다시 숨기고 싶다는 점을 제외하고는 정상적으로 작동합니다. 이 작업을 수행하는 예제 코드를 발견했지만 두 코드를 성공적으로 비교할 수는 없습니다. 코드를 추가하면 사용자가 클릭 할 때 검색 결과가 숨겨 질 수 있지만 사용자가 먼저 클릭해야 볼 수 있습니다. 분명히 작동하지 않습니다.결과, W3Schools 숨기기 PHP 예제 AJAX 라이브 검색
http://www.w3schools.com/php/php_ajax_livesearch.asp http://bytes.com/topic/javascript/answers/676788-hide-div-tag-if-outside-div-clicked
사람이 올바른 방향으로 날 포인트?
감사
크리스
체크 아웃 이벤트 '에 onblur'자바 스크립트.
당신은 사업부를 삭제 새로운 기능을 만들 수 있습니다
blurFunction() {
document.getElementById("livesearch").innerHTML = ''
}
에 onblur 이벤트 :
<input type="text" size="30" onkeyup="showResult(this.value)" onblur="blurFunction()" />
편집 : 사실 난 그냥 showResult 기능은 아직, 사업부를 삭제를 충족시켜줍니다 발견 방금 삽입하십시오 :
<input type="text" size="30" onkeyup="showResult(this.value)" onblur="showResult('')" />
OP가 전체 div를 숨기고 innerHTML 텍스트를 지우는 대신 이벤트에 다시 나타나게하려고 생각했습니다. 나는 그것을 잘못 읽고있을 수도 있습니다. –
안녕하세요 스티브. onblur showResult 함수는 올바르게 작동하고 멀리 클릭하면 결과 div를 숨기지 만 결과 블록 내부의 링크를 unclickable로 만드는 불행한 결과가 발생합니다. 이 문제를 해결할 방법이 있습니까? 감사합니다 – user1098178
당신의 도움에 감사드립니다. 이걸 사용하면 효과가 있습니다. $ (문서) .click (함수 (e) { var elem = $ (e.target) .attr ('id'); if (elem! == 'livesearch ') { $ ('# livesearch ') .fadeOut ('빠름 '); } }); – user1098178
제가이 권리를 읽는다면, 마우스를 움직일 때 입력이 포커스를 잃어 버렸을 때 다시 클릭하면 안된다.
상자를 숨기려면 onblur 이벤트를 사용하여이 작업을 수행 할 수있었습니다 (사용자가 발견 한 예제가 똑같이 잘 작동한다고 믿습니다). onblur="hide(this)" 드롭 다운 div 숨기기. js 함수 숨기기는 동일합니다. function hide(id) { document.getElementById("livesearch").style.display = "none"; }
마우스 오버시 다시 나타나게하려면 onmousemove 이벤트를 <input type="text" size="30" onkeyup="showResult(this.value)" onblur="hide(this)" onmousemove="showResult(this.value)" /> 입력에 추가했습니다.
가장 중요하게는 div를 다시 표시하려면 xmlhttp.onreadystatechange=function()에 document.getElementById("livesearch").style.display = "block"; 줄을 추가했습니다.
귀하의 모든 도움에 감사드립니다. 이걸 사용하면 효과가 있습니다. $ (문서) .click (함수 (e) { var elem = $ (e.target) .attr ('id'); if (elem! == 'livesearch ') { $ ('# livesearch ') .fadeOut ('빠름 '); } }); – user1098178