1

我正在为我的网站开发一个搜索表单，我计划使用 JQuery UI 自动完成小部件在用户键入时建议值。到目前为止，这些建议确实有效。

问题是当用户从列表中选择一个值时，输入字段不会更新。之前似乎已经报告过同样的问题，例如：Jquery UI Autocomplete 不再允许使用鼠标选择选项，但没有发布解决方案。

代码尽可能简单：

<script> 
jQuery(document).ready(function(){

    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];

    jQuery("#tbauthor").autocomplete({
        source: availableTags,
    });   

});
</script>
<div id="primary" class="aside main-aside sidebar">
    <form style="font-size: 10px;" name="search-news" action="." method="get">
    <table border= "0">

        <tr class="advanced"><td>Cerca per autor</td><td><input type="text" id="tbauthor" name="autor" /></td></tr>

    </table>
</form>
</div>

我正在使用带有 Arras 主题的 wordpress 3.5、JQuery 1.8.3 和 jQuery UI 1.9.2（已经包含在 wordpress 安装中）。为了加载自动完成库，我在 header.php 中调用 wp_enqueue_script 这是一个摘录（header.php）。我唯一的猜测是加载的库有问题：

wp_enqueue_script('jquery');
wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false); 
wp_enqueue_script('jquery-ui-autocomplete', null, array('jquery-ui-core', 'jquery'), null, false);

更新，随着问题的解决，该示例不再是非工作示例：最后，您可以在我的网站中看到非工作示例：http: //www.cabanyal.com/nou/resultat/?id= 1994

在此先感谢您的帮助。

4

1 回答 1

1

您的 WordPress 主题包含一个过时版本的 jQuery 验证器插件，这会导致与自动完成功能发生冲突：

<script type='text/javascript' src='http://www.cabanyal.com/nou/wp-content/themes/arras/js/jquery.validate.min.js'></script>

我能够在这里复制这个问题： jsfiddle.net/VAna6/1

将脚本更改为最新版本，自动完成功能应如下所示：http: //jsfiddle.net/VAna6/2/。

于 2013-01-13T17:52:38.220 回答