2013-08-11 2 views
0

내 프로젝트에 대한 자동 제안 옵션을 만드는 중입니다. 사용자가 LI를 클릭하면 값을 검색 필드에 씁니다.하지만 문제는 사용자가 클릭은 먼저 focusout 이벤트를 실행하고 그 후에 만 ​​click 이벤트를 실행합니다. 사형 집행의 순서를 바꾸는 방법이 있습니까? MY CODE :포커스를 실행하기 전에 클릭 이벤트가 발생했는지 확인하는 방법

<form id="form1" name="form1" > 
Type name: 
<input type="text" id="autosuggest" class="autosuggest" autocomplete="off"/> <input type="submit" value="search" /> 
<div class="dropdown" name="dropdown"> 
    <ul class="result"></ul> 
</div> 
<br> 
some text 
</form> 
<div id="results"></div> 

하고 여기에 마법 happends :

$(document).ready(function(){ 
$('.autosuggest').keyup(function(){ 
    var thisposition = $(this).position(); 
    var search_term = $(this).val(); 

    $.post('searcher.php', {search_term:search_term}, function(data){ 
     $('.result').html(data); 

     $('.result li').click(function(){ 
      var result_value = $(this).text(); 
      $('.autosuggest').val(result_value); 
      $('.result').html(''); 

     }); 

    }); 

    $('.autosuggest').focusout(function(){ 
     $('.result').html(''); 
    }); 

    $('div[name=dropdown]').css({ 
     'position' : 'absolute', 
     'top': eval (thisposition.top + 27) + 'px', 
     'left':eval (thisposition.left) + 'px', 
     'background':'white' 
    }); 

}); 

을});

제안 사항?

+0

나의 제안은 기존의 jQuery를-UI 자동 완성 위젯을 사용하는 것입니다 : 여기 경우 다른 사람의 코드가 같은 문제가 있습니다. http://jqueryui.com/autocomplete/ – DevlshOne

+0

@DevlshOne은 기존 UI를 사용하여 당신의 oun을 만드는 것만 큼 흥미롭지 않습니다 :) –

+0

나는 동의하지만 훨씬 덜 악화됩니다. : D – DevlshOne

답변

0

나는 dropdown div를 입력하고 나가기 전에 focusout 이벤트 핸들러를 설정 및 설정 해제하여이 문제를 해결했습니다.

  $('.dropdown').mouseenter(function() { 
      $('.autosuggest').off('focusout.mynamespace'); 
     }); 
     $('.dropdown').mouseout(function() { 
      $('.autosuggest').focusout(function(){ 
       $('.result').html(''); 
      }); 
     }); 
관련 문제