Question

当我调用此自定义函数时

$.fn.inputBoxHelper = function () {
    var args = arguments[0] || {};
    var matchingElem = $.grep(this, function (e) { return $(e).val() == $(e).attr('title'); });
    $(matchingElem).addClass(args.className);

    this.bind({
        focus: function(){
            if ($(this).val().trim() == $(this).attr('title')) { $(this).val(emptyString).removeClass('gray'); }
        },
        blur: function(){
            if ($(this).val().trim() == emptyString) { $(this).val($(this).attr('title')).addClass('gray'); }
        }
    });
    return this;
}

喜欢这个

$('input:text').inputBoxHelper({ className: 'gray' });

当我给它打电话时，它给了我错误

$("input:text,input:checkbox").inputBoxHelper is not a function
file:///D:/repository/scripts/script_tests/test.js
Line 20

即使我将功能更改为

$.fn.inputBoxHelper = function () {return this;}

它做同样的事情。它似乎运行正常并且正常工作，因为所有功能都在输入框上工作，但是会出错。有人有什么想法吗？

Answer 1

检查您是否未将jQuery加载到页面中两次。一些插件或插件库喜欢包含jQuery。因此，它可以覆盖您现有的jQuery实例，并使用new - fresh - 实例覆盖$和jQuery变量，从而导致现有插件未定义。在定义jQuery时，插件会添加到jQuery的原型中。因此，如果您销毁该对象的唯一实例，则原型将重置为其原始形式。因此，这些插件不再是原型的一部分。

此外，它可能没有任何内容，JSLint报告您在您发布的该函数定义的最后一行上缺少分号。它应该是：

$.fn.inputBoxHelper = function () {
  var args = arguments[0] || {};
  var matchingElem = $.grep(this, function (e) { return $(e).val() == $(e).attr('title'); });
  $(matchingElem).addClass(args.className);

  this.bind({
     focus: function(){
          if ($(this).val().trim() == $(this).attr('title')) { $(this).val(emptyString).removeClass('gray'); }
      },
      blur: function(){
          if ($(this).val().trim() == emptyString) { $(this).val($(this).attr('title')).addClass('gray'); }
      }
  });
  return this;
};

总是通过JSlint运行所有javascript的好主意。它可以帮助您找到您可能花费数小时寻找的东西。

Answer 2

插件需要在可以使用之前加载。

上面的评论证实OP在加载之前试图使用该插件。

jQuery .fn说“不是函数”

2 个答案: