Jquery Javascript函数未定义

Jquery Javascript函数未定义,javascript,jquery,django-autocomplete-light,Javascript,Jquery,Django Autocomplete Light,我试图用python django应用程序调试JS/Jquery问题,同时尝试在我自己的django项目中实现它。我已使用浏览器的开发者控制台检索以下错误: TypeError: 'undefined' is not a function (evaluating '$(this).yourlabsWidget()') 所以我去寻找函数“yourlabsWidget()是在哪里定义的,它就在函数调用的正上方 $.fn.yourlabsWidget = function(overrides) {

我试图用python django应用程序调试JS/Jquery问题,同时尝试在我自己的django项目中实现它。我已使用浏览器的开发者控制台检索以下错误:

TypeError: 'undefined' is not a function (evaluating '$(this).yourlabsWidget()')
所以我去寻找函数“yourlabsWidget()是在哪里定义的,它就在函数调用的正上方

$.fn.yourlabsWidget = function(overrides) { ... }

$(document).ready(function() {
$('.autocomplete-light-widget[data-bootstrap=normal]').live('initialize', function() {
     $(this).yourlabsWidget();
});
我对javascript或jquery了解不多,所以在这里我完全不知所措。假设没有语法错误,这样的问题是否意味着jquery不能正常工作?我知道这不是很多信息,但我会添加任何其他需要的相关信息

给我带来麻烦的应用程序和特定文件分别在这里

我已经在我的开发服务器上用它自己的测试项目测试了这个应用程序,它在它自己的测试项目中是开箱即用的。然而,如果我把一个可以工作的测试应用程序安装到我自己的django项目中,它就不再工作了

更新:

整个函数定义:

$.fn.yourlabsWidget = function(overrides) {
var overrides = overrides ? overrides : {};

if (this.data('widget') == undefined) {
    // Instanciate the widget
    var widget = new yourlabs.Widget(this);

    // Pares data-*
    var data = this.data();
    var dataOverrides = {autocompleteOptions: {}};
    for (var key in data) {
        if (!key) continue;

        if (key.substr(0, 12) == 'autocomplete') {
            var newKey = key.replace('autocomplete', '');
            newKey = newKey.replace(newKey[0], newKey[0].toLowerCase())
            dataOverrides['autocompleteOptions'][newKey] = data[key];
        } else {
            dataOverrides[key] = data[key];
        }
    }

    // Allow attribute overrides
    widget = $.extend(widget, dataOverrides);

    // Allow javascript object overrides
    widget = $.extend(widget, overrides);

    this.data('widget', widget);

    // Setup for usage
    widget.initialize();

    // Widget is ready
    widget.widget.attr('data-widget-ready', 1);
    widget.widget.trigger('widget-ready');
}

return this.data('widget');
}
HTML(包括)


窗口。_uadmin_media_前缀_uu=“/static/admin/”;
HTML格式:

<span class="autocomplete-light-widget customer_order_products_set-0-product_id
single"
id="id_customer_order_products_set-0-product_id-wrapper"
data-max-values="1" data-bootstrap="normal"
data-autocomplete-url="http://127.0.0.1:8000/autocomplete/InventoryAutocomplete/" data-autocomplete-choice-selector="[data-value]" data-autocomplete-placeholder="THIS IS WORKING"
>


注意:我知道URL不可移植。这只是为了测试。

您是否尝试过这种方法:

$.fn.yourlabsWidget = function(overrides) { ... };
$(document).ready(function() {
    $('body').on('load', function() {
       $('.autocomplete-light-widget input[data-bootstrap=normal]').yourlabsWidget();
    });
});
或者你也可以试试这个:

$(document).ready(function() {
   $('.autocomplete-light-widget input[data-bootstrap=normal]').yourlabsWidget();
});

我猜您在代码中缺少输入或select标记引用。看看这是否有效

$(this).yourlabsWidget()
未定义不是函数

这意味着
$(This).yourlabsWidget
未定义

您将加载jQuery两次:

  • jQuery已加载
  • 自动完成插件加载到jQuery中
  • jQuery将再次加载
  • 它没有自动完成插件

能否提供$.fn.yourlabsWidget()的实现?我认为实现是指函数的代码。当然可以。我会更新这个问题。如果这不是你的意思,请让我知道,我会纠正。如果
在它自己的测试项目中开箱即用
不清楚当你遇到错误时有什么不同正是我的问题,我希望javascript处理其函数定义的方式有一些我不了解的地方,也许有人会马上意识到问题一定与脚本加载不正确有关,或者一定是出了问题。好吧,当我这样做时,错误会消失,但我的应用程序仍然无法工作。我真的不相信代码本身有问题,因为我已经在我的开发服务器上用自己的测试项目测试了应用程序,它在自己的测试项目中开箱即用。我会把它加到问题上。谢谢你的意见。第二个选项给了我完全相同的错误。我猜您在代码中缺少输入或select标记引用。请提供标签,我在这里假设。我道歉,洁,我不确定你指的是什么。我尽量避免代码过载,因为我并不认为问题与代码本身有关,因为它在测试应用程序中可以正常工作。我希望有一些我不知道的相关javascript和jquery库问题会导致函数未定义。如果有帮助的话,我会在问题中增加更多的代码。你能粘贴与此相关的html吗?这是正确的答案!您的base.html和其他扩展html文件可能正在调用jQuery
$(document).ready(function() {
   $('.autocomplete-light-widget input[data-bootstrap=normal]').yourlabsWidget();
});