2014-04-16 2 views
1

자동 완성 필드를 설정하고 싶습니다. 그래서 HTML로jQuery UI 자동 완성 IE 11 - 유선 동작

$(document).ready(function() { 
    $("#mytext").autocomplete({ 
     source: function(request, response) { 
      $.getJSON("/ajax/autocomplete.php?term=" + $.trim(request.term), function(data) { 
       response($.map(data, function(item) { 
        return {label: highlightResult(item.label, $.trim(request.term))}; 
       })); 
      }); 
     }, 
     minLength: 0 
    }).each(function() { 
     $(this).data("ui-autocomplete")._renderItem = function(ul, item) { 
      return $("<li></li>") 
        .data("item.autocomplete", item) 
        .append("<a>" + item.label + "</a>") 
        .appendTo(ul); 
     }; 
    }); 
    ... 
    $("#mytext").focusin(function() { 
     $(this).autocomplete("search", $(this).val()); 
    }); 
}); 

을 썼다 :

<div style="visibility: hidden;"/> 
    <input type="text" id="mytext" /> 
</div> 
<button onclick="showDiv();">Click To Show</button> 

이 코드는 구글 크롬에서 잘 작동합니다. 하지만 IE 11에서 이상하게 작동합니다.

입력 내용은 기본적으로 숨겨져 있지만 버튼을 클릭하면 나타납니다.

이상한 행동 :
1) 자동 완성 메뉴 새로 고침 에 창 (몸)의 왼쪽 상단에 나타납니다.
2) 텍스트 상자에 텍스트가있는 경우 메뉴가 표시되지 않습니다. 나는 data 매개 변수가 때로는 (텍스트가있을 때), 정의되지 않은 - wierd ...

이러한 문제는 어떻게합니까? 도움이되는 해결책을 찾지 못했습니다.

+0

이 DIV 필드에 위치를 가지고 있습니까? –

+0

CSS가있는 CSS 또는 스크립트가 없습니다.이 코드는 – nrofis

+0

입니다. 죄송합니다. 질문을 잘못 읽었습니다. 이제 그 문제를 이해하고 대답합니다. –

답변

1

또 다른 가능성은

disabled: true 

옵션과 함께 자동 완성을 작성하고이

0

요소의 가시성이 hidden으로 설정된 경우 IE는 이벤트를 처리하지 않으므로 DOM 준비가되면 이벤트를 수신 할 수없는 것으로 이벤트를 연결하려고 시도하므로 정의되지 않은 동작이 발생합니다. 대신 $(document).ready()를 사용하는

+0

그 작품. 그러나 다른 브라우저는 잘 작동했습니다 (IE ...). 두 번째 유선은 여전히 ​​신비 스럽지만 몇 가지 세부 사항을 발견했습니다. 나는 질문을 갱신 할 것이다. – nrofis

2

을 필요하면 내가 정확히 같은이 그것을 가능하게하는 것입니다 showDiv 함수에서 자동 완성 호출을 사용하여 문제. 일부 자동 완성은 페이지를 새로 고친 후 표시됩니다. 왜 그런지는 모르겠지만 폼에 많은 것들이 있기 때문에 버그는 단지 몇 가지 컨트롤에서만 발생합니다.
마크 THOMANN로 문제를 해결하는 또 다른 방법은 말했다 - 비활성화 자동 완성과 (내 트릭)

$(document).ready(function() { 
... 
/**** that is last line ***// 
if (msieversion() === 11) {setTimeout(enable_autocomplete, 200);} 

// 함수 enable_autocomplete를() $를 포함 추가 자동 완성 ("옵션", ("my_selector."). "disabled", false); }});

그래서 내 코드는 다음과 같습니다

var autocomplete_options = {/** your usual options **/}; 
if (msieversion() === 11) { 
autocomplete_options.disabled = true; 
}; 
$("#mytext").autocomplete(autocomplete_options);