Jquery Javascript函数未定义

我试图在尝试在我自己的django项目中实现它时调试一个使用python-django应用程序的JS/Jquery问题。我用我的浏览器的开发者控制台来获取以下错误：Jquery Javascript函数未定义

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项目中，它将不再有效。

UPDATE：

全功能定义：

$.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（含）

<!DOCTYPE html> 
<html lang="en-us" > 
<head> 
<title></title> 
<link rel="stylesheet" type="text/css" href="/static/admin/css/base.css" /> 
<link rel="stylesheet" type="text/css" href="/static/admin/css/forms.css" /> 
<!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="/static/admin/css/ie.css"  /><![endif]--> 

<script type="text/javascript">window.__admin_media_prefix__ = "/static/admin/";</script> 


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript" src="/static/autocomplete_light/autocomplete.js"></script> 
<script type="text/javascript" src="/static/autocomplete_light/widget.js"></script> 
<script type="text/javascript" src="/static/autocomplete_light/addanother.js"></script> 
<script type="text/javascript" src="/static/autocomplete_light/text_widget.js"></script> 
<script type="text/javascript" src="/static/autocomplete_light/remote.js"></script> 
<link rel="stylesheet" type="text/css" href="/static/autocomplete_light/style.css" />

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" 
>

注：我知道这个网址是不是便携。这只是为了测试。

来源

2012-12-22 Jglstewart

你可以提供$ .fn.yourlabsWidget（）的实现吗？ – nekman

我认为通过实现你的意思是函数的代码。当然可以。我会更新这个问题。如果这不是你的意思，请让我知道，我会纠正。 – Jglstewart

如果'在开箱即用的自己的测试项目中工作'不清楚什么是不同的，当你得到错误 – charlietfl

你试过这样：

$.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(); 
});

我猜你缺少在代码中输入或选择标签参考。看看这个工程

来源

2012-12-22 17:59:16 Jai

嗯，当我这样做时，错误消失，但我的应用程序仍然无法正常工作。我真的不相信代码本身存在问题，因为我已经在我的开发服务器上用自己的测试项目测试了应用程序，并且它在自己的测试项目中开箱即用。我会在这个问题上加上这一点。 – Jglstewart

看到更新的答案，希望这有助于。 – Jai

感谢您的输入。第二种选择是给我完全相同的错误。 – Jglstewart

$(this).yourlabsWidget() undefined is not a function

这意味着$(this).yourlabsWidget是未定义的。

您正在加载的jQuery两次：

jQuery是加载
自动完成插件加载到jQuery的
jQuery是再次加载
它不具备的自动完成插件

来源

2013-01-30 15:29:46 jpic

这是正确的答案！您的base.html和其他扩展的html文件可能正在调用jQuery –

Jquery Javascript函数未定义

回答

相关问题