Javascript 如何在多个动态生成的XML提要选择列表中使用jQuery禁用所选选项？

好的，我已经在这里和网络上到处找了找，找不到适合这种情况的答案

我有一个页面，允许动态创建5个选择列表，这些列表是XML提供的。我需要禁用所有选择列表中的任何选择选项。我仅限于使用jQuery 1.5.1，并且必须支持跨浏览器返回IE7。代码如下：

HTML

Foo选择列表
加载

JS

$（文档）.ready（函数（）{
//XML导入代码
$.ajax({
键入：“获取”，
url:“../includes/foo.xml”，
数据类型：“xml”，
成功：函数（xml）{
变量select=$（'.foo1'）；
$（xml）.find（'rid'）.each（function（）{
var fna=$（this.find（'fna'）.text（）；
select.append（“+fna+”）；
$（this）.find（'value'）.each（function（）{
var值=$（this.text（）；
});
});
select.children（“：first”）.text（“请进行选择”）.attr（“selected”，true）；
$（“输入，选择”）.focus（函数（）{（this）.fooTooltip（）；}）；
}
});
//添加/删除元素的代码
$（'btnAdd'）.attr（'disabled'，''）；
$（'#btnAdd'）。单击（函数（）{
var num=$（'fieldset.clonedInput'）.length；//有多少个“可复制”输入字段
var newNum=newnumber（num+1）；//新输入字段的数字ID
var selects=$（'select'）；//用于所有选择列表
var newElem=$（'#input'+num）.clone（）.attr（'id'，'input'+newNum）；
newElem.children（）.find（'select.foo select'）.attr（'id'，'foo'+newNum）；
newElem.find（'input.foo remove'）.removeClass（'hidden'）.attr（'disabled'，''）.attr（'id'，'foo'+newNum）；
$（'#input'+num）.after（newElem）；
$（“输入，选择”）.focus（函数（）{（this）.fooTooltip（）；}）；
$（“选择[id^='foo']选项：选中”）.val（）；
$（'option[value=“value to search for”]”，this.remove（）；
选择.change（函数（）{
var VAL={}；
选择.each（函数（）{
vals[this.value]=true；}）.get（）；
选择.not（this.children（）.not（“：selected”）.not（“：first child”）.each（函数（）{this.disabled=vals[this.value]；}）；
});
如果（newNum==5）
$（'btnAdd'）.attr（'disabled'，'disabled'）；
返回false；
});
$（'input.foo remove'）.live（“单击”，函数（）{
$（this）.closest（'fieldset.clonedInput'）.remove（）；
var num=$（'fieldset.clonedInput'）.length；//有多少个“可复制”输入字段
$（'btnAdd'）.attr（'disabled'，''）；
如果（num-1==0）
$（'.foo remove'）.attr（'disabled'，'disabled'）.addClass（'hidden'）；
返回false；
});
});

---

在添加第一个克隆的选择列表时，禁用选定选项将起作用，但在后续克隆上不起作用。我把一切都抛在这上面了，就是弄不明白。请…非常感谢您的帮助。谢谢

这样如何，假设您的变量

fna

为“foo”：

因此，在类（和值）为“foo”的选项上，只要单击其中一个选项，就会隐藏所有其他“foo”选项

太疯狂了，它可能会起作用……；）

---

祝你好运

只是想澄清一下，你是说要添加一个新的、独立的点击处理程序功能，还是要将其添加到一个预先存在的功能中？嘿，Jen-我没有看到你原来的处理程序（很匆忙），但首先也要添加这个，看看它能给你带来什么。实际上，您需要“活动”部分，因为您正在动态地向DOM添加元素。如果这行得通的话，那么是的，你可能想把你现有的点击逻辑和它结合起来。谢谢，马修。这是一个我没有考虑过的非常有趣的想法——我会试试看。但是，还有一个问题……如果用户添加了一个选择列表，在该选择列表中选择了一个选项（将禁用类添加到所有其他列表中的该选项中），然后在选择了该选项的情况下删除该选择列表，该怎么办？在我的代码中，当这种情况发生时，禁用状态保留在页面上其他选择列表的相应选项上。

<fieldset class="clearfix clonedInput" id="input1">
<div class="toolTipHolder">
<label for="FooName" class="foo-select">Foo Select List
<select class="foo1 required infoTrigger foo-select" id="foo1" attr-info="This     will be tooltip text.">
<option>loading</option>
</select>
</label>
<input type="button" value="Remove this option" class="foo-remove hidden clearfix" />
</div>
</fieldset>
</div>
<div class="clear">&nbsp;</div>
<div><a href="#" class="addFoo"><input id="btnAdd" type="button" value="Add another foo" class="btnAdd" /></a></div>

$(document).ready(function() {
//XML IMPORT CODE
$.ajax({
type: "GET",
url: "../../includes/foo.xml",
dataType: "xml",
success: function(xml) {
var select = $('.foo1');
$(xml).find('rid').each(function(){
var fna = $(this).find('fna').text();
select.append("<option>"+fna+"</option>");
$(this).find('value').each(function(){
var value = $(this).text();
});
});
select.children(":first").text("please make a selection").attr("selected",true);
$("input, select").focus(function(){ $(this).fooTooltip(); });
}
});
// CODE TO ADD/REMOVE ELEMENTS
$('#btnAdd').attr('disabled','');
$('#btnAdd').click(function() {
var num     = $('fieldset.clonedInput').length; // how many "duplicatable" input fields
var newNum  = new Number(num + 1);      // the numeric ID of the new input field
var selects = $('select');      //for all select lists
var newElem = $('#input' + num).clone().attr('id', 'input' + newNum);
newElem.children().find('select.foo-select').attr('id', 'foo' + newNum);
newElem.find('input.foo-remove').removeClass('hidden').attr('disabled','').attr('id', 'foo' + newNum);
$('#input' + num).after(newElem);
$("input, select").focus(function(){ $(this).fooTooltip(); });
$("select[id^='foo'] option:selected").val();
$('option[value="value-to-search-for"]', this).remove();
selects.change(function() {
var vals = {};
selects.each(function() { 
vals[this.value] = true; }).get();
selects.not(this).children().not(':selected').not(':first-child').each(function() { this.disabled = vals[this.value]; });
});
if (newNum == 5)
$('#btnAdd').attr('disabled','disabled');
return false;
});
$('input.foo-remove').live("click", function() {
$(this).closest('fieldset.clonedInput').remove();
var num = $('fieldset.clonedInput').length; // how many "duplicatable" input fields
$('#btnAdd').attr('disabled','');
if (num-1 == 0)
$('.foo-remove').attr('disabled','disabled').addClass('hidden');
return false;
});
});

select.append("<option class="+fna+">"+fna+"</option>");

$("option").live("click",function(){
    var _class = $(this).attr("class");
    $("."+class).hide();
});