Jquery ui自动完成不能处理输入文本

时间:2013-05-06 11:37:18

标签: jquery jquery-ui

Jquery自动完成不适用于输入文本框

以下是我的javascript代码

 <script type="text/javascript" src="js/jquery.js"></script>
 <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
 <script type="text/javascript" src="js/jquery.jcarousel.min.js"></script>
 <script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>
 <script type="text/javascript" src="js/serverSideValidation.js"></script>
 <script type="text/javascript" src="js/clientSideValidation.js"></script>
 <script type="text/javascript" src="js/jquery.ui.autocomplete.min.js"></script>

 <script type="text/javascript">

 $(document).ready(
function() {
    $('#slideshow').cycle({
        fx : 'fade',
        speed : 'slow',
        timeout : 5000,
        pager : '#slider_nav',
        pagerAnchorBuilder : function(idx, slide) {
            // return sel string for existing anchor
            return '#slider_nav li:eq(' + (idx) + ') a';
        }
    });

    addSearchHelp();
});

function addSearchHelp() {
    var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC",
            "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang",
            "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp",
            "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme" ];
    $("input#searchBox")[0].autocomplete({source:availableTags, minLength: 2});
}

以下是我的输入文本框

<input name="searchBox" id="searchBox" type="text" class="input-header" 
style="background-image:url(images/search-bg.png); background-repeat:repeat-x; 
background-position:center; height:31px; width:423px" size="65" maxlength="60" 
 onblur="this.value=Trim(this.value)" onkeypress="return checkenter(event,'product')" 
  />

请建议回答我的问题

2 个答案:

答案 0 :(得分:2)

试试这种方式,

<强>脚本

    $(document).ready(function() {
        $('#slideshow').cycle({
            fx : 'fade',
            speed : 'slow',
            timeout : 5000,
            pager : '#slider_nav',
            pagerAnchorBuilder : function(idx, slide) {
                // return sel string for existing anchor
                return '#slider_nav li:eq(' + (idx) + ') a';
            }
        });

        $('#searchBox').on('keyup', function(event){
            addSearchHelp();
        });

    });

    function addSearchHelp() {
        var availableTags = [ "ActionScript", "AppleScript", "Asp", "BASIC",
                "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang",
                "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp",
                "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme" ];
        $("input#searchBox").autocomplete({source:availableTags, minLength: 2});
    }

<强> HTML

<input name="searchBox" id="searchBox" type="text" class="input-header" size="65" maxlength="60" onblur="this.value=Trim(this.value)" onkeypress="return checkenter(event,'product')" />

希望这会对你有所帮助。

答案 1 :(得分:0)

尝试:

$(“input#searchBox”)。autocomplete({source:availableTags,minLength:2});

您正在尝试将.autocomplete应用于DOM对象,而不是它所期望的jQuery对象。