5

我正在尝试在我的项目中使用 jquery 的自动完成功能。但我不知道为什么它甚至不打电话。

我把我的jsp文件如下..

<input id="productName" name="productName" type="text" placeholder=""/>

在我的js文件中..我写过..

$("#productName").autocomplete({
        /*source: '${pageContext. request. contextPath}/search'*/
        source: function( request, response ) {
            alert('asdfasdfasdfasdfadsf');
            $.ajax({
                url: "/../search",
                data: "q="+request.term,
                dataType: "json",
                success: function( data ) {
                    response( $.map( data.values, function( item ) {
                        return {
                            label: item.label,
                            value: item.value
                        }
                    }));
                }
            });
        },
        minLength: 2,
        select: function( event, ui ) {
        },
        open: function() {
            //$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
        },
        close: function() {
            //$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
        }
    });

正如我在火虫中展示的那样..我可以看到下面的js加载了..这个页面......

bootstrap.min.js
jquery-ui.js
jquery-v2.0.3.js
jquery.autocomplete.js
jquery.big-slide.js
jquery.big-slide.js
jquery.big-slider.min.js
jquery.validate.js
product.js - this contains above js code..

控制台没有任何错误...加载页面时..

我不知道是什么问题..我真的陷入了这个..作为一个框架，我使用阔叶树作为 spring-mvc ..

提前致谢

4

1 回答 1

8

您需要先加载jQuery然后jQuery UI再加载Bootstrap JS，正确的顺序应该是：

jquery-v2.0.3.js
jquery-ui.js
bootstrap.min.js

代替：

bootstrap.min.js
jquery-ui.js
jquery-v2.0.3.js

编辑：

对于未来的访问者，原因实际上是因为已经包含自动完成功能之间的冲突jquery-ui.js。jquery.autocomplete.jsjquery-ui.js

因此，您只需要删除jquery.autocomplete.js即可使其正常工作。

于 2014-03-07T18:34:48.317 回答