Javascript Jquery如何使用变量作为.change（）函数的标识符？

现在我是Javascript/Jquery的初学者。 我想创建一个动态代码，这样当网站出现一些新功能时，它就可以工作，而不需要编辑代码

现在我刚刚在一些帖子中读到如何使用变量作为id的标识符，但它对我不起作用。下面是一个例子：

var category;
$('#mainCategory').change(function (event) {
   checkboxID = event.target.id;
   category="category"+checkboxID;
   ...some code...
});
$("#"+category).change(function (event) {
    $('#category'+checkboxID+' :input').attr('class','' );
    console.log("var: "+category);
});

因此，当我使用整个表达式而不是使用变量时，函数maincography总是在另一个之前运行，并且在第二个函数中正确写入了category。 我希望你能帮助我

html代码部分：

 <form method="post" action="../php/saveTraining.php">
    <section id="mainCategory" class="hidden">
        <label><input type="checkbox" id="Krafttraining">Krafttraining</label>
        <label><input type="checkbox" id="Joggen">Joggen</label>
    </section>
    <section id="categoryKrafttraining" class="hidden">
        <label><input type="checkbox">Kurzhantel</label>
        <label><input type="checkbox">Bankdrücken</label>
        <label class="hidden"><input type="number" id="saetze">Sätze</label>
        <label class="hidden"><input type="number" id="wiederholungen">Wiederholungen</label>
    </section>
    <input type="hidden" id="saveTraining" name="sent" value="save" class="hidden"/>
</form>

卡夫培训
约根
库尚泰尔酒店
班克德鲁肯
萨泽
维德隆根

因此，实际发生的情况是，当选中mainCategory的复选框时，会出现第二部分的复选框。

---

但是当我选中第二部分的复选框时，什么也没有发生。

我以前以为我有解决方案，但我发现我错了。我认为这应该是可行的，在这里您重新添加侦听器作为

var类别的值

change:

var category;
$('#mainCategory input[type="checkbox"]').change(function (event) {
     checkboxID = event.target.id;
     category="category"+checkboxID;

     $('#' + category).find('input[type="checkbox"]').off("change").on("change", function (event) {
         $('#category'+checkboxID+' :input').attr('class','' );
         console.log("var: "+category);
     });
 });

---

您需要重新添加侦听器，因为新的元素将作为var类别更改的目标。

我以前以为我有解决方案，但我发现我错了。我认为这应该是可行的，在这里您重新添加侦听器作为

var类别的值

change:

var category;
$('#mainCategory input[type="checkbox"]').change(function (event) {
     checkboxID = event.target.id;
     category="category"+checkboxID;

     $('#' + category).find('input[type="checkbox"]').off("change").on("change", function (event) {
         $('#category'+checkboxID+' :input').attr('class','' );
         console.log("var: "+category);
     });
 });

---

---

您需要重新添加侦听器，因为新的元素将作为var类别更改的目标。

忘记写入var checkboxID；作为globalUnless，您在我们看不到的地方手动调用

maincography

change函数-

category

在创建处理程序时未定义。您正在将

checkboxID

添加到“category”以使

category

变量。。。然后在调用

attr（）

时再次将其添加到处理程序中。即使剩下的代码被修复了，这也不会起作用，除非你的HTML比我们想象的更奇怪。你能展示你正在使用的HTML吗？最好使用一个你关心的所有元素都会被给出的类。然后，您可以使用事件委派来动态添加该类的成员。请参阅显示一些与此相关的html忘记编写var checkboxID；作为globalUnless，您在我们看不到的地方手动调用

maincography

change函数-

category

在创建处理程序时未定义。您正在将

checkboxID

添加到“category”以使

category

变量。。。然后在调用

attr（）

时再次将其添加到处理程序中。即使剩下的代码被修复了，这也不会起作用，除非你的HTML比我们想象的更奇怪。你能展示你正在使用的HTML吗？最好使用一个你关心的所有元素都会被给出的类。然后，您可以使用事件委派来动态添加该类的成员。设置

on（）

处理程序时，请参见显示一些与此相关的html不是

类别

还是

空

（或者更确切地说，未初始化）？

$（“#”+类别）

现在如何有效？你的意思是

$（文档）.on（'change'、'#category'，function…

？谢谢它是这样工作的，但我真的不明白为什么。因为当本节中的某个内容正确更改时调用mainCategory函数？但第二个函数的形式相同，但在另一节中。我将在上面添加html代码。这不是一个好方法。它将导致多个错误如果您从

#maincography

中选择相同的类别，则要将处理程序添加到

#+category

。如果用户多次选择相同的项目，这将复合事件侦听器。起初，我只想侦听maincography中已选中的所有复选框，而第二个复选框未选中，但不知怎的是用于选中的选择器当您在（）上设置

处理程序时，

$（“#”+category）

框不起作用仍然

null

（或者更确切地说，未初始化）？

$（“#”+category）

现在如何有效？您的意思是

$（文档）。on（'change'、'#category'，function…

？谢谢它是这样工作的，但我真的不明白为什么。因为当本节中的某个内容正确更改时调用mainCategory函数？但第二个函数的形式相同，但在另一节中。我将在上面添加html代码。这不是一个好方法。它将导致多个错误如果您从

#maincography

中选择相同的类别，则要将处理程序添加到

#+category

。如果用户多次选择相同的项目，这将复合事件侦听器。起初，我只想侦听maincography中已选中的所有复选框，而第二个复选框未选中，但不知怎的是用于选中的选择器箱子不工作