自动完成“不是功能”

Posted 2023-05-08

【中文标题】自动完成“不是功能”

【英文标题】：autocomplete "is not a function"

【发布时间】：2011-07-07 08:12:34

【问题描述】：

我们已经在一个简单的 html 页面中测试了 Jquery UI (jquery-ui-1.8.10.custom.min.js) 自动完成功能，该功能有效。

然后我们将相同的代码复制到 Asp.net 用户控件中，它停止工作。 javascript 错误显示“$searchBox.autocomplete 不是函数”。

此用户控件正在 Asp.net Sitefinity 3.7 项目中使用。在页面上它有一个 ScriptManager。不知道我还能添加什么...

有人知道发生了什么吗？

修改：

<script src="/js/jquery-1.5.min.js" type="text/javascript"></script>
<script src="/js/jquery-ui-1.8.10.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () 
        var termTemplate = "<span class='ui-autocomplete-term'>%s</span>";

        $('input#searchInput').autocomplete(
            source: ['johannesburg z', 'johannesburg x', 'johannesburg v', 'johannesburg b', 'johannesburg a', 'johannesburg q', 'johannesburg u', 'johannesburg y', 'johannesburg o', 'johannesburg p'],
            minLength: 3,
            open: function (e, ui) 

                var 
                acData = $(this).data('autocomplete'),
                styledTerm = termTemplate.replace('%s', acData.term);

                acData
                .menu
                .element
                .find('a')
                .each(function () 
                    var me = $(this);
                    me.html(me.text().replace(acData.term, styledTerm));
                );

            
        );
    );
</script>
<div class="outerSearchBox">
    <div class="searchFieldWrapper">
        <input id="searchInput" type="text" class="searchField" /><a class="searchButton">SEARCH
        </a>
        <div class="searchSugContainer">

谢谢。

【问题讨论】：

我找到了答案。我两次加载 jQuery 库。 ***.com/questions/19591155/…

【参考方案1】：

该错误通常表示 jquery 或插件尚未加载。在加载文档之前检查您的函数调用是否被命中：

$(function()
    var $searchBox = $('#mysearchBox');
    $searchBox.autocomplete(...);
);

还要检查 javascript 文件的路径是否正确。 Firebug 或 google chrome 开发者工具对于检查这两个问题都很有用。

【讨论】：

我已通过 Firebug 确认文件正在下载且顺序正确。 JQuery，JQuery UI，然后我使用自动完成。

您是否有机会重新审视这个问题？

【参考方案2】：

可能是：

jquery.js 的加载顺序。 重复的 jquery.js 包含在同一页面中。

【讨论】：

我在创建新的 .Net 核心应用程序时收到了同样的消息，我在 _Layout.cshtml 文件的顶部添加了 Jquery/JQueryUI 引用，但事实证明 JQuery 库默认为在页面正文呈现后添加到页面底部。我对此发表了评论，效果很好

【参考方案3】：

也许尝试使用jQuery.noConflict() method 进行测试。它基本上只是让你为 jQuery 使用不同的别名。这在 SF4.3 中对我有用。

var j = jQuery.noConflict();
// Do something with jQuery
j("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';

【参考方案4】：

我遇到了这个问题，我的 jQuery 文件加载了两次。几乎这是在我的脑海中：

<script src="assets/js/jquery.min.js"></script>
<script src="js_css/jquery-ui.min.js" ></script>

然后我有一个 AJAX 调用，它加载了我的文档的更多部分，还有另一个：

<script src="assets/js/jquery.min.js"></script>

我的 AJAX 结果中的脚本标记和我的 $.hmtl() 我的结果到我的文档。通过这样做，我们几乎重新定义了 jquery-ui.min.js 更改或利用的所有 var。

【参考方案5】：

这是由于与 Sitefinity 自己使用 jQuery 的冲突造成的。

如果您将 jQuery 的脚本引用移动到页面底部的结束表单标记之前。这将解决 Sitefinity 4.0 中的问题，但我怀疑它也会解决 Sitefinity 3.7 中的问题。