Javascript 将特性应用于多个对象

在对另一个输入字段进行更改后，我很难找到使用jQuery对多个输入字段应用更改的最佳方法。如果只有一个活动id，下面的代码可以工作。但是，当存在多个活动时，我的代码只将最后一个实例应用于所有活动如何更改此项以分别应用于每个活动id？

---

目标

组织状态从“活动”切换到“暂停”。

对于每个活动id：

• 禁用活动状态下拉列表
• 如果活动状态为“已续订”，则保留为“已续订”
• 如果活动状态为“活动”，则切换到“暂停”
• 如果活动状态为“暂停”，则保留为“暂停”

组织状态从“暂停”切换到“活动”。

对于每个活动id：

• 启用活动状态下拉列表
• 保持状态不变

---

以下是代码（请忽略表格！）：

var活动状态=功能（）{
//如果组织状态设置为“暂停”且活动为“活动”，则将活动状态设置为“暂停”并禁用下拉列表。
如果（$（'#orgautorenewstatus'）.val（）=“暂停”&&$（'.autorenewstatus'）.val（）=“活动”）{
$（'.autorenewstatus'）.prop（'disabled'，'disabled'）；
$（'.autorenewstatus'）.val（“暂停”）；
}
//如果组织状态设置为“暂停”且活动为“暂停”或“续订”，请保留活动状态并禁用下拉列表。
else if（$（'#orgautronewstatus'）.val（）=='Pause'）{
$（'.autorenewstatus'）.prop（'disabled'，'disabled'）；
}
否则{
$（'.autorenewstatus'）.prop（'disabled'，false）；
}
};
$（活动状态）；
$（“orgautorenewstatus”）。更改（活动状态）

组织状态
活跃的
停顿




运动状态
#1
停顿
活跃的
更新
#2
停顿
活跃的
更新
#3
停顿
活跃的
更新
对于多个活动，这将是我的看法。
像这样把你所有的活动包装在它自己的div中

…

为下拉框分配一个类（因为
id
s是唯一的）

…

版本2（改进：参见）

仅影响给定活动div中的那些项目（而不是在所有活动中循环）

我把你的逻辑简化了一点，这是我的工作示例

var campaign_status = function () {
      var newStatus = $('#orgautorenewstatus').val() == "Pause"? 'disabled' : false;
      $('.autorenewstatus').each(function(){
        if($(this).val() == "Active") {        
            $('.autorenewstatus').prop('disabled', newStatus);
            $('.autorenewstatus').val("Pause");
        } else {
            $('.autorenewstatus').prop('disabled', newStatus);
        }
      });

  };
  $(campaign_status);
  $("#orgautorenewstatus").change(campaign_status);

首先，缓存jQuery对象。无需每次需要与元素接口时都创建新的jQuery对象

但是，当与多个活动一起使用时，代码表现不佳的原因有两个：

对于
#orgautorenewstatus
，您使用了id而不是类
每个活动都应该位于HTML中自己的范围内
要解决此问题，请将每个活动包装在单独的
div
元素中，并将id更改为类。然后遍历活动并将脚本应用于每个活动

确保在选择元素时仅引用脚本当前操作的活动中包含的元素


$（'.campaign'）。每个（函数（）{
var oars=$（'.orgautorenewstatus'，此）；
var ars=$（'.autorenewstatus'，this）；
var活动状态=功能（）{
ars.prop（'disabled'，oars.val（）=“Pause”）；
if（oars.val（）=“Pause”）ars.each（function（））{
如果（this.value==“活动”）this.value='Pause'；
});
};
运动状态（）；
更改（活动状态）；
});
/*仅用于装饰目的*/
.campaign{display:inline块；宽度：33%；}*{margin:0；}

组织状态活动暂停活动状态#1活动暂停活动状态#2活动暂停活动状态#3活动暂停组织状态活动暂停活动状态#1活动暂停活动状态#2活动暂停活动状态#3活动暂停活动状态#3活动暂停组织状态活动暂停活动状态#1活动暂停活动状态#2活动暂停活动状态#3活动暂停活动状态#等等
是什么你的问题？具体地说，如果只有一个活动id，则上面的代码有效。但是，当存在多个活动时，上面的代码仅将最后一个实例应用于所有活动。我如何将其更改为分别应用于每个活动id？我会更新最初的帖子。你可以使用你能澄清一下，如果所有其他活动都在同一个id下吗？或者检查我的答案，看看我是否在正确的轨道上？我认为这不适用于多个活动，我认为，这是OP询问的问题。OP会澄清，但我认为每个活动都有自己的id下拉列表（如，它自己的
#organautorenewstatus
）
var campaign_status = function () {
      var newStatus = $('#orgautorenewstatus').val() == "Pause"? 'disabled' : false;
      $('.autorenewstatus').each(function(){
        if($(this).val() == "Active") {        
            $('.autorenewstatus').prop('disabled', newStatus);
            $('.autorenewstatus').val("Pause");
        } else {
            $('.autorenewstatus').prop('disabled', newStatus);
        }
      });

  };
  $(campaign_status);
  $("#orgautorenewstatus").change(campaign_status);