어떻게하면 jQuery 자동 완성 프로그램의 이후 바인딩이 실행되지 않도록 할 수 있습니까?

Question

아래 코드는 매우 간단합니다. 내가 #search에 의해 참조 된 HTML 텍스트 입력에 바인딩 된 autocomplete jQuery 있습니다. 사용자가 무언가를 입력하면 드롭 아웃 목록에 서버의 제안 사항이 표시됩니다. 사용자가 제안 중 하나를 클릭하거나 선택한 상태에서 Enter를 누르면 팝업 내에 호출 된 페이지를 보여주는 팝업 (페이스 박스)이 나타납니다. 대신 사용자가 일반적인 검색을 실행하고 추천을 선택하지 않으려면 Enter 키를 누르거나 #searchButton을 클릭하면됩니다. 다른 말로 :

1. 자몽
2. 선택 가능한 제안이 표시됩니다.
3. 시나리오 1 : 사용자는 프레스 입력, 마우스 또는 키보드와 제안을 선택하거나 클릭 - 항목, 즉 자동 완성의 결과 .handler 화재 (그리고 .keypress)
4. 시나리오를 팝업 것을 원인 2 : 사용자가 에 관심이 없으며 대신 을 입력하거나 #searchButton을 클릭하여 #search에 입력 한 내용을 모두 검색합니다. 자동 완성의 결과 핸들러가 실행되지 않고 Enter 키 누르기가 #searchButton의 클릭 이벤트를 트리거하거나 직접 트리거 (즉, 실제로 클릭)되어 정상 검색을 트리거합니다.

이것은 IE6, IE7, IE8, Chrome, Safari에서는 아름답게 작동하지만 firefox에서는 작동하지 않습니다.

firefox에서는 제안에서 Enter 키를 누르면 결과 핸들러와 키 누르기 이벤트가 모두 발생하여 사용자에게 전체 검색을 수행 할뿐만 아니라 페이스 박스 팝업이 표시됩니다. 나는 어떻게 든 멈추는 것을 막는 것이라고 생각했다 .keypress. result 화재는 그 트릭을 할 것입니다, 그러나, 나는 그렇게하는 방법을 알아낼 수 없었습니다. jQuery의 stopPropogation()과 stopImmediatePropogation()을 .result 처리기에 넣으려고했는데 .keypress가 실행되는 것을 막을 수 있기를 바랬지 만 변경되지 않았습니다.

누군가가 어떤 생각을 갖고 있거나이를 통해 나를 도우려는 경우, 나는 가장 감사하게 생각합니다.

미리 감사드립니다.

jQuery("#search").autocomplete("/index/suggest", { 
     selectFirst: false, 
     formatItem: function(data, i, n, value) { 
      return "<font color='#3399CC'>" + value.split("::")[0] + "</font>"; 
     }, 
     formatResult: function(data,value) { 
      return value.split("::")[0]; 
     } 
    }).result(function(event, data, formatted) { 
     alert('Hello, someone selected a suggestion by clicking on it or pressing enter on it, so you\'re getting this!'); 
     var pieces = formatted.split("::"); 
     var url = '/' + pieces[1] + '/detail/?id=' + pieces[2]; 
     jQuery.facebox({ ajax: url }); 
    }).keypress(keypressHandler).blur(function() { 
     alert('I don\'t want this to appear if .result above is called, and it doesnt, except in firefox! Bah!'); 
     jQuery(this).flushCache(); 
    }); 

    function keypressHandler(e) 
    { 
     if(e.which == 13) { 
      if(!jQuery('#searchButton').is(':disabled')) { 
       jQuery(this).blur(); 
       jQuery('#searchButton').focus().click(); 
      } 
     } 
    } 

Answer 1

검색 상자에서 keypress 이벤트를 바인딩 해제하고 자신의 keypress 핸들러를 다시 바인딩 해 보셨습니까?

jQuery("#search").autocomplete("/index/suggest", { 
    selectFirst: false, 
    formatItem: function(data, i, n, value) { 
     return "<font color='#3399CC'>" + value.split("::")[0] + "</font>"; 
    }, 
    formatResult: function(data,value) { 
     return value.split("::")[0]; 
    } 
}).result(function(event, data, formatted) { 
    alert('Hello, someone selected a suggestion by clicking on it or pressing enter on it, so you\'re getting this!'); 
    var pieces = formatted.split("::"); 
    var url = '/' + pieces[1] + '/detail/?id=' + pieces[2]; 
    jQuery.facebox({ ajax: url }); 
}); 

jQuery("#search").unbind("keypress").keypress(keypressHandler).blur(function() { 
    alert('I don\'t want this to appear if .result above is called, and it doesnt, except in firefox! Bah!'); 
    jQuery(this).flushCache(); 
}); 

자동 완성 처리기에서 대신 처리되는 다른 키 이벤트가있을 수도 있습니다. 나는 당신이 자동 완성 "목록"에 떠나는 동안 텍스트 입력에서 그들 모두를 제거하고자 할 것이라고 생각합니다. 자동 완료로 처리 한 이벤트가 keypress와 다른 경우 이벤트를 제거하는 것이 좋습니다.

Answer 2

자바 스크립트로 간단히 할 수 있습니다 더 버블 링에서 이벤트를 중지하기 위해 이벤트 핸들러 함수에

return false; 

.