Javascript Getting.on（）使用动态创建的HTML元素

从jQuery中的

.on（）

方法中获取所需的功能时遇到了一些问题。我试图让它开始检查页面首次加载时不存在的HTML元素的更改。不幸的是，我无法在Google或Stack Overflow上显示任何类似的示例

以下是我的情况：我有一些下拉菜单和一些HTML文本框，我只想在从下拉菜单中选择特定选项（“其他”选项）时显示文本框

我使用带有显示或隐藏文本框的函数的（'change'）可以很好地实现这一点。该代码如下所示：

$(document).ready(function(){
$("#partialOther_1").hide(); //textbox id = partialOther_1
$("#partial_1" ).on('change', function() { //dropdown id = partial_1
  var partVar1 = $(this).val();
  if(partVar1 > 0) {
    $("#partialOther_1").show();
  }
  else {
    $("#partialOther_1").hide();
  }
});

问题是，我想为另一个下拉/文本框对完成同样的事情，如果选择了第一个下拉菜单中的某个内容，则该下拉/文本框对仅出现在HTML中。我尝试了下面的代码，但我认为问题在于第二个条件。当脚本运行时，它的计算结果为false，我不确定重新检查条件并获取

.on（）

方法继续“侦听”的最佳方法（如果为true）。如果可能的话，我不想使用

setInterval（）

$(document).ready(function(){
   var partVar2 = 0
   $("#partial_1" ).on('change', function() {
     var partVar2 = $(this).val();
     if(partVar2 > 0) {
       $("#brokerOther_1").hide();
      }
   });
   if(partVar2>0) { //'broker' only exists in HTML  if partial_1 >0
     $("#broker" ).on('change', function() { 
     var brokerVar = $(this).val();
     if(brokerVar == 4) {
       $("#brokerOther_1").show();
     }
     else {
       $("#brokerOther_1").hide();
     }
     });
   }
});  

---

非常感谢您的帮助

在绑定事件时检查条件，而应在事件发生时检查：

$("#broker").on('change', function() {
  if (partVar2 > 0) {
    var brokerVar = $(this).val();
    if(brokerVar == 4) {
      $("#brokerOther_1").show();
    } else {
      $("#brokerOther_1").hide();
    }
  }
});

如果元素从一开始就不存在，则需要使用委托，即将事件绑定到某个确实存在的父元素，并使用第二个选择器指定从何处侦听事件：

$(document.body).on('change', "#broker", function() {

---

如果可能，请使用一个比body元素更接近元素的元素，以便它必须检查尽可能少的事件。

请提供您的HTML代码，以及您使用的jQuery版本是什么？要看一看。@kehrk使用1.10.2（）。谢谢你的HTML代码怎么样？@kehrk HTML的棘手之处在于，动态元素不是由我的代码创建的，而是由我用来创建调查的GUI创建的。我会尽快将相关部分复制到这篇文章中。谢谢，我现在就来试试。我认为这样做行不通的原因是，我认为如果我试图对一个尚不存在的元素调用一个方法（在本例中是代理），脚本将失败——这是错误的吗？@cerpintaxt:我感觉该元素确实存在，但它是隐藏的。你是在动态地向页面添加元素吗？是的，很抱歉，我现在意识到我的帖子不清楚。仅当从“partial_1”编辑帖子中选择了某个内容时，“broker”元素才存在于html代码中。@cerpintaxt:当您不想使用委托绑定事件时。我在上面添加了代码。

$(document).ready(function(){
   var partVar2 = 0
   $("#partial_1" ).on('change', function() {
     var partVar2 = $(this).val();
     if(partVar2 > 0) {
       $("#brokerOther_1").hide();
      }
   });
   if(partVar2>0) { //'broker' only exists in HTML  if partial_1 >0
     $("#broker" ).on('change', function() { 
     var brokerVar = $(this).val();
     if(brokerVar == 4) {
       $("#brokerOther_1").show();
     }
     else {
       $("#brokerOther_1").hide();
     }
     });
   }
});