2010-06-01 44 views
0

我想弄清楚如何在选择框中选择相应选项时如何从选择框中删除选项。基本上用户可以通过选择框在这里添加多条记录,但是我想删除可用的选项列表,例如,它们不能在两个选择框中输入相同的值。jQuery indexOf选择框操作

当单击添加更多按钮时,我淡入下一个选择框容器。一些选择框已经由PHP生成,我使用JS来隐藏它们。每个选择框都有一个附加到ID的唯一编号,所以我想要访问那些包含字符串“other_pet_types”的选择框,然后我想通过当前可见的迭代并构建已选择的值的数组,然后我将从新显示的选择框中的选项列表中删除。

这是我迄今为止,但它肯定是不正确的 - 我无法得到ID的初始测试工作。

任何指针非常赞赏,因为我意识到我目前的标志相当宽广!

var vals = new Array(); 
//build array with currently selected options 
    $('p.mult_entries select').each(function(){ 
      vals += $(this).val(); 
    }); 
    $("p.mult_entries:hidden:first").fadeIn("slow", function() { 
      $(this).find(('select').attr('id').indexOf('other_pet_types') > 0).each(function(){ 
      console.log($(this).val()); //as expected prints nothing - need to iterate through the options of the above select 
       //once i extract the correct values, iterate through new select box and use inArray to remove options where that value already exists in one of previous select boxes 
     }); 
    }); 

回答

1

我做了一个快速​​的作品。它不是构建一个单独的数组,而是通过选择选项进行演示。您可能需要添加逻辑来更改选择并重新启用先前的选择。您可以使用jQuery的.data()函数来存储该值,以便您可以在更改后检索该值。或者您可以将其保存为cookie。不过,这应该让你开始。

+0

感谢布拉德利,非常整洁。我有这个几乎工作,但Chrome浏览器抛出“意外的标记非法”错误 - 我认为它来自这一行:$(“。filter”)。not(this).children()。each(function(){。 ... 任何想法? – kenny99 2010-06-01 16:48:34

+0

嗯......这很有趣我没有得到铬的错误。铬是否告诉你什么是非法令牌?有一点需要注意的是,如果你从jsFiddle复制粘贴,你可以在代码中加上额外的问号......不知道这是为什么 – 2010-06-01 16:54:51

+0

啊,明白了 - 实际上看不到任何额外的字符,但删除了我从jsFiddle粘贴的代码和之前的代码之间的所有间距,一定是那里的一些垃圾角色。再次感谢! – kenny99 2010-06-01 17:23:49

1

您构建阵列的方式是错误的。你正在像一个字符串构建它,而不是一个数组。这应该工作:

$('p.mult_entries select').each(function(){ 
    vals[vals.length] = $(this).val(); 
}); 

你找到合适的选择框的方式可以变成只是一种选择,而不是若干功能:

$(this).children("select[id^=other_pet_types]").each(function(){ 
    //do stuff here 
}); 
+0

感谢Pickle,我现在快到了。我真正想要做的就是这样,遍历每个选择中的选项 - 我尝试了以下,但我得到一个错误“无法识别的表达式:选项” $(this).children(“select ($。inArray(vals,$(this).val())) $(this).remove() (); }); – kenny99 2010-06-01 15:27:54