Onclick 이벤트가 작동하지 않음, Onmouse 작동 중임

AJAX를 사용하여 즉석 검색을 구축했습니다. 입력 결과가 나타나기 시작한 후 본문 결과를 아무 곳이나 클릭하면 입력 필드 결과에서 onmouse가 다시 나타납니다. 입력 필드 결과를 클릭하면 사라집니다.Onclick 이벤트가 작동하지 않음, Onmouse 작동 중임

입력 필드에서 클릭하면 onmouse 이벤트 이후에이 결과가 열려 있기를 원합니다. 클릭 이벤트가 추가되었지만 작동하지 않습니다.

코드를 확인하고 가능한 모든 방법을 제안하십시오.

<script type="text/javascript"> 
    function showResult(str) { 
     if (str.length == 0) { 
      document.getElementById("search-result").innerHTML = ""; 
      document.getElementById("search-result").style.border = "0px"; 
      return; 
     } 
     if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp = new XMLHttpRequest(); 
     } 
     else { // code for IE6, IE5 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange = function() { 
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
       document.getElementById("search-result").innerHTML = xmlhttp.responseText; 
       document.getElementById("search-result").style.border = "1px solid #A5ACB2"; 
       document.getElementById("search-result").style.display = "block"; 
       document.getElementById("search-input").onmouseover = function() { 
        show_box() 
       }; 
       document.getElementById("search-input").onclick = function() { 
        show_box() 
       }; 
      } 
     } 
     xmlhttp.open("GET", "instant-search.php?keyword=" + str, true); 
     xmlhttp.send(); 
    } 

    function close_box() { 
     fadeOut(); 
     document.getElementById("search-result").style.display = "none"; 

    } 

    function show_box() { 
     setOpacity(0); 
     document.getElementById("search-result").style.display = "block"; 
     fadeIn(); 
    } 
    document.onclick = function() { 
     close_box() 
    }; 

    function setOpacity(value) { 
     document.getElementById("search-result").style.opacity = value/10; 
     document.getElementById("search-result").style.filter = 'alpha(opacity=' + value * 10 + ')'; 
    } 

    function fadeIn() { 
     for (var i = 20; i <= 100; i++) 
     setTimeout('setOpacity(' + (i/5) + ')', 5 * i); 
    } 

    function fadeOut() { 
     for (var i = 20; i <= 100; i++) 
     setTimeout('setOpacity(' + (5 - i/5) + ')', 5 * i); 
    } 
</script>

HTML 코드

<input name="keyword" type="text" size="50" id="search-input" onkeydown="showResult(this.value)" autocomplete="off" /> 
<div id="search-result"></div>

출처

2012-08-03 Tall boY

어디에서 'onclick' 이벤트가 HTML에 있습니까? –

그것의 자바 스크립트, 내가 HTML에서 너무 필요합니까. –

@Bhuvan Rikka : HTML이 아닌 javascript로 표시됩니다. –

를 작동하는지 테스트합니다.

if(!e) { 
    e = window.event; 
} 

if(e.stopPropagation && e.preventDefault) { 
    e.stopPropagation(); 
    e.preventDefault(); 
} else { 
    e.cancelBubble = true; 
    e.returnValue = false; 
}

출처

2012-08-03 09:29:43 thinklinux

이제 완벽하게 작동했습니다. 고맙습니다. 마우스 오버 이벤트가 다시 발생하는 것을 막아서 마우스 오버에 대한 페이딩 효과의 깜박임을 다시 표시하지 않는 방법을 알려줄 수 있습니까? –

나는 당신의 질문에 위의 – thinklinux

에 대해 onmouseenter 또는 onmouseleave에서 여전히 깜박이지 않았다고 언급했다. –

이 시도?

<input name="keyword" type="text" size="50" id="search-input" onclick="showResult(this.value)" autocomplete="off" />

또는 onclick을 내가 그래서 IE에 차이가 잊고 jQuery를에있어

<input name="keyword" type="text" size="50" id="search-input" onclick="alert('replace this with your function you want to call');" autocomplete="off" />

출처

2012-08-03 08:28:38 Francois

그래,이 일하고있다하지만 난 자바 스크립트에서 나는 onclick 및 onkeyup이 방법은 자바 스크립트에서 나는 단지 쿼리 결과를 표시하고 숨길 필요가있는 두 가지 결과가 될 것입니다. –

나는 인터넷 익스플로러가 아닌 모든 브라우저에서 작동하는 @thinklinux 방법을 시도했다. 그 문제를 해결할 방법이 있습니까? –

try false false – ZigZag

Onclick 이벤트가 작동하지 않음, Onmouse 작동 중임

답변

관련 문제