javascript - 使用命名空间缓存 dom 元素

Question

我正在尝试使用命名空间来 chache DOM，但是当我打电话时，我得到“未定义”而不是 jQuery 对象

  <form id="create_profile">  

      <input type="text" name="name"/>
      <input type="text" name="email" />
      <input type="text" name="password" />
      <input type="text" name="passwordconfirm" />

      <span onclick="profile.create()">valider</span>

 </form>

JS：

 var profile = {

  create: function(){

   alert(profileFields.test); // show done!
   alert(profileFields.create_form.attr('id')); // show undefined instead of create_profil

  }


}

var profileFields = {

        test: "done!",  
        create_form: $("#create_profile"),
        $email: $("input[name='name']", this.create_form),
        $password: $("input[name='pass']", this.create_form),
        $passwordconfirm: $("input[name='passconfirm']", this.create_form),
        $name: $("input[name='email']", this.create_form),
        $tel: $("input[name='tel']",this.create_form)  

}

score 1 · Accepted Answer

这告诉我们您的 JavaScript 代码在该元素存在之前$("#create_profile")正在运行，因此返回一个空的 jQuery 对象。调用attr一个空的 jQuery 对象返回undefined. 如果您的script标签在 HTML 中高于它所引用的元素，则在脚本运行时这些元素将不存在。

任何一个

将script标签放在 HTML 的最后，就在结束</body>标签之前，或者
使用 jQueryready来暂停代码的执行，直到“DOM 准备就绪”。

#1 是首选，除非您不控制script标签的去向。更多的：

score 0 · Accepted Answer

您可能只是没有等到 DOM 准备好。

将您的代码包装在：

$(function () {
    //your code
});

javascript - 使用命名空间缓存 dom 元素

2 回答 2

Related

Reference