Question

我已经创建了一个include.js文件，我已将所有常规函数放入其中。之前该函数位于文件本身中。

我从Chrome控制台收到错误消息，指出changeColor()未定义。

我不希望它在这里变得混乱，所以我在PasteBin上粘贴了一些帖子。

if(username.val() == '')
{
    changeColor('#inputname');
    exclamation('#inputname');
    $.notify("U hebt geen gebruikersnaam opgegeven", "error");
    return false;
}

所以changeColor()未定义，exclamation()也是如此。现在出现了Pastebin部分：http://pastebin.com/5bbPuT4e

正如您所看到的，我有一个header.php文件，其中包含了我整个网站所需的所有JS文件。在include.js文件中创建函数，在aanmelden.js文件中调用函数。在我看来，我不能再看清楚，所以我真的不知道我做错了什么。

Answer 1

删除include.js中的document.ready。这会创建范围，因此changeColor和exclamation只存在于包装函数中。 include.js应该是：

 function changeColor(elem) {
            $(elem).css({
                    "border-radius": "5px",
                    "font-weight":   "bolder",
                    "border":        "1px solid red"
            });
  }           
  function exclamation(elem) {                   
          $(elem).notify(
                "-",
                        { position:"right" }
          );
  }

注意不再是document.ready。

javascript中有关函数范围的一些信息： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope

Answer 2

此外，您可以扩展jQuery原型以更“jQuery方式”使用这些方法：

$.fn.extend({

  changeColor: function() {    
    return this.each(function() {
      this.css({
        "border-radius": "5px",
        "font-weight":   "bolder",
        "border":        "1px solid red"
      });
    });
  },

  exclamation: function() {
    return this.each(function() {
      this.notify("-", {position:"right"});
    });
  }

});

// Use the newly created methods like this:
$('#inputname').changeColor();
$('#inputname').exclamation();

这样您就不必担心定义函数的范围。

来源：http://api.jquery.com/jQuery.fn.extend/

功能未定义

2 个答案: