-1

我想我在选择元素时误解了一些东西。

我有以下查询：

$('#my_id_1 #my_id_2').my_function();

<form id="my_id_1">
  <input id="my_id_2" type="text" />
</form>

我虽然这my_function()只会在my_id_2"inside"时触发my_id_1。

但是该功能也会在我有my_id_2但没有的另一个页面上触发my_id_1。

谁能告诉我我在这里缺少什么？

代码更新 

$('#my_form #country').my_func().autosuggest_country();


(function () {
  // "Namspace" which also kind of works like an interface
  $.fn.my_func = function(opt) {
    this.autosuggest_country = autosuggest.autosuggest_country ;
    return this;
  }


  var autosuggest = {
    autosuggest_country : function(action) {
      $(this).autocomplete({ (...) });
    }
  }
})(jQuery);

第 1 页 

<form id="my_form" class=""  method="post" onsubmit="return false;">
  <input id="country" type="text" autocomplete="off"  required="required" />
</form>

第2页

<div id="mainSection" class="mainGrid">

  <div class="selectCountry">
    <select id="country" name="selectlist_country"> (...) </select>
  </div>
</div>
4

3 回答 3

4

您当前的代码块将创建一个包含与选择器匹配的所有内容的 jQuery 选择对象，'#my_id_1 #my_id_2'然后将 jQuery 方法my_function()应用于该选择器。无论选择对象是否为空，都会调用该方法，因为该对象仍然拥有所有 jQuery 方法。

jQuery 中有一种方法可以为选择中的每个元素运行一次代码块。这就是.each()方法。这应该适用于您正在做的事情，因为 ID 应该只在页面上出现一次（因此'#my_id_1 #my_id_2'应该只对应于单个 DOM 元素）。

要实现这一点，您将使用如下代码，具体取决于my_function是 jQuery 方法还是函数。

常规功能：

$('#my_id_1 #my_id_2').each(my_function());

jQuery方法：

$('#my_id_1 #my_id_2').each($(this).my_function());

这将为my_function()$('#my_id_1 #my_id_2') 中的每个元素调用一次，这应该是零次或一次。在 的范围内my_function，this将对应于这两种情况下选择中的元素。

编辑：编辑因为评论现在不起作用。

你应该能够做到：

$('#my_form #country').each(
    $(this).my_func().autosuggest_country()
)

您要做的是应用my_func()到中的每个元素$('#my_form #country')（如果选择器为空，则不执行任何操作），因此我们this在 a中使用 jQuery 选择器.each()。 this是 DOM 元素，而不是 DOM 的 jQuery 选择器，所以我们需要使用$(this)来访问 jQuery 方法。然后，您可以在标准方法链接中使用方法this（由 返回）。my_func()

看到这个小提琴。

于 2013-04-25T16:45:43.927 回答
0

该函数my_function总是被执行。它是否具有以下语法：

$.fn.my_function = function(){
    return this.each(function(){

    });
}

如果您不使用，this.each只需执行您的代码。总会被执行！.each确保它循环通过选定的元素。

于 2013-04-25T16:28:50.697 回答
0

Id在任何页面上都应该是唯一的..

$('#my_id_1 #my_id_2') 首先不需要。

Just $('#my_id_2').my_function() 应该做。

因此，如果您只想针对您正在谈论的特定页面上的实例..然后给出input a class name instead.

<form id="my_id_1">
  <input class="my_id_2" type="text" />
</form>

现在这只会在您期望的页面上触发

$('#my_id_1 .my_id_2').my_function();

或更好

`$('.my_id_2', '#my_id_1').my_function();`
于 2013-04-25T16:37:25.870 回答