jquery ui autocomplete - 不在IE中工作

时间:2010-09-21 13:14:54

标签: javascript jquery internet-explorer autocomplete

此代码适用于Firefox但不适用于IE。有任何想法吗?我正在使用最新的jQuery-ui库。

<!DOCTYPE html>
 <html lang="en">
<head>
<meta charset="UTF-8" />
<title>jQuery UI Autocomplete Remote datasource demo</title>
<link type="text/css" href="jquery.ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="jquery.ui.core.js"></script>
<script type="text/javascript" src="jquery.ui.widget.js"></script>
<script type="text/javascript" src="jquery.ui.position.js"></script>
<script type="text/javascript" src="jquery.ui.autocomplete.js"></script>
<link type="text/css" href="demos.css" rel="stylesheet" />
<style type="text/css">
.ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif')       right center no-repeat; }
 .ui-autocomplete {
  overflow-y: auto;
  max-width: 400px;
 }
 /* IE 6 doesn't support max-width
  * we use width instead, but this forces the menu to always be this wide
  */
 * html .ui-autocomplete {
  width: 400px;
}
</style>
<script type="text/javascript">

$(function() {
 function log(message) {
  $("<div/>").text(message).prependTo("#log");
  $("#log").attr("scrollTop", 0);
 }

 $.ajax({
  url: "links2.xml",
  dataType: "xml",
  success: function(xmlResponse) {
   var data = $("ROW", xmlResponse).map(function() {
    return {
      value: $("SC_DF_FIELD_1", this).text(),
      url: $("SC_DF_FIELD_2", this).text(),
      support_url: $("SC_DF_FIELD_3", this).text(),
      description: $("SC_DF_FIELD_4", this).text(),
      contact: $("SC_DF_PERSON_LINK", this).text()

    };
   }).get();

   $("#_results").autocomplete({
    source: data,
    minLength: 0

   }).data( "autocomplete" )._renderItem = function( ul, item ) {
   return $( "<li></li>" )
   .data( "item.autocomplete", item )
   .append( "<a>" + item.value + "<br>" + item.url + "<br>" + item.description + "<br>" + "Support URL: " + item.support_url + "<br>" + "Contact: " + "<a href=" + item.contact + ">Test</a>" + "<br />" + "</a>" )
   .appendTo( ul );
 }

  }
 })

});
</script>

   

    搜索:                     

1 个答案:

答案 0 :(得分:0)

该代码在IE中适用于我。我看到的唯一区别是我正在使用googleapis版本的jquery和jqueryui:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script>

唯一可能的区别是标记,因为你没有发布你的标记。我只是有这样的输入:

<input type="text" id="_results" />