【问题标题】:Uncaught TypeError: Object [object Object] has no method 'border'?未捕获的类型错误:对象 [对象对象] 没有方法“边框”?
【发布时间】:2013-04-16 12:33:45
【问题描述】:

这个错误让我发疯了!无论如何,我创建了一个简单的 jQuery 插件,我称之为“border”,但我得到了这个错误:

Uncaught TypeError: Object [object Object] has no method 'border'

郑重声明,jQuery 仅包含一次,并且包含在我的插件之前。

我用它来避免冲突:

<pre>
var $jq = $.noConflict();
//$.noConflict();
$jq("li").borderX('1px solid blue');
</pre>

编辑:

这是我的插件代码:

jQuery(document).ready(function ($) {
    $.fn.borderX = function (params) {
        params = $.extend({width: 'null', color: 'null', radius: 'null'}, params);
        this.each(function () {
            var $t = $(this);
            var response = jQuery.parseJSON(params);
            if (typeof response == 'object') { //It is JSON
                if (params.width) {
                    $t.css('border-width:', params.width);
                }
                if (params.color) {
                    $t.css('border-color:', params.color);
                }
                if (params.radius) {
                    $t.css('border-radius:', params.radius);
                }
            } else {
                $t.css('border', params);
            }
        });
        return this;
    };
});

我调用名为“borderX”的插件的 HTML 代码是:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.borderX.js"></script>
<script type="text/javascript">
var $jq = $.noConflict();
//$.noConflict();
$jq("li").borderX('1px solid blue');
</script>

编辑°2:

$.fn.border = function (options) {
    var params = $.extend({width: 'null', color: 'null', radius: 'null'}, options);
    this.each(function () {
        var $t = $(this);
        var response = jQuery.parseJSON(params);
        if (typeof response == 'object') { //It is JSON
            if (params.color) {
                $t.css('border-color:', params.color);
            }
            if (params.radius) {
                $t.css('border-radius:', params.radius);
            }
        } else {
            $t.css('border', params);
        }
    });
    return this;
};

【问题讨论】:

  • 你如何设置你的插件?
  • 请发布您的插件,称为“边框”,您正在调用borderX 方法。
  • 我实际上已将名称更改为“borderX”,我得到了同样的错误。我一直在叫“borderX”。
  • 错误不在上面的代码中 - 它在您的插件中。我们可以看看代码吗?
  • 您没有从您的插件中提供一盎司的代码。有两件事浮现在脑海 - 你没有加载插件或者你没有将插件暴露给 jQuery,因此如果 jQuery 没有“看到”它,该方法将不存在。

标签: javascript jquery plugins


【解决方案1】:

删除插件的第一行和最后一行,使其不包含在document.ready

(function($) {
    $.fn.borderX = function(params) {
        params = $.extend( {width: 'null', color: 'null', radius: 'null'}, params);
        this.each(function() {
            var $t = $(this);
            var response = jQuery.parseJSON(params);

            if(typeof response == 'object')
            { //It is JSON
                if(params.width){$t.css('border-width',params.width);}
                if(params.color){$t.css('border-color',params.color);}
                if(params.radius){$t.css('border-radius',params.radius);} 
            }
            else
            {
                $t.css('border',params);
            }
        });
        return this;
    };
})(jQuery);

【讨论】:

  • 我做了,但实际上,我得到了另一个错误。似乎无法识别“扩展”:未捕获的类型错误:无法调用未定义的方法“扩展”
  • 好吧,现在我用这个: $jq("li").border({width: '2px', color: 'red', radius: '1px'});它产生相同的错误:未捕获的类型错误:无法调用未定义的方法“扩展”
  • 其他地方肯定有冲突,因为我可以将该代码复制并粘贴到此页面上的控制台中,并在没有错误的情况下运行它并为所有内容添加边框(上面的代码中有一个错字,我已修复- 我从每个样式属性后删除了:。)
  • 这很奇怪:(我仍然得到这个:Uncaught TypeError: Cannot call method 'extend' of undefined jquery.border.js:3 $.fn.border jquery.border.js:3 (anonymous函数)events.html:19(匿名函数)
  • 这正是我的 jquery.border.js 文件!
猜你喜欢
  • 2012-02-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-05-12
  • 2014-04-10
相关资源
最近更新 更多