的JQuery找不到元素

我有以下的（只显示适用线）的JQuery找不到元素

var setUploadDoneIndicator = function(form) 
{ 
    if ($(form).find('[id$=_upload_done_indicator]').is(':checked') == false) 
    { 
     console.log("Setting indicator"); 
     $(form).find('[id$=_upload_done_indicator]').trigger('click'); 
    } 
} 

var unsetUploadDoneIndicator = function(form) 
{ 
    if ($(form).find('[id$=_upload_done_indicator]').is(':checked') == true) 
    { 
     console.log("UnSetting indicator"); 
     $(form).find('[id$=_upload_done_indicator]').trigger('click'); 
    } 
} 

$('[id$=_upload_form]').each(function (event) 
{ 
    current_form = this; 

    $(this).fileupload(
    { 
     done: function (e, data) 
     { 
      setUploadDoneIndicator(current_form); 
     } 
    }); 
}

这正确蜱复选框的脚本，这个想法是听上的复选框的另一个JS文件的选中状态。如果我在这个脚本中的setUploadDoneIndicator（）之后立即调用unsetUploadDoneIndicator（），那么它会拒绝tickbox。

然后在另一个JS文件我有

$('#pricing_ab_upload_done_indicator').change(function() 
{ 
    if ($(this).is(':checked')) 
    { 
     console.log("got checked"); 
     unsetUploadDoneIndicator($('#pricing_ab_upload_form')); 
    } 
});

其中要求在第一个脚本的功能，但不会取消勾选复选框。我不确定的指针是否正确传递过来，打印出的unsetUploadDoneIndicator（）它打印出一个jQuery对象，这似乎是正确的接收对象时，该

if ($(form).find('[id$=_upload_done_indicator]').is(':checked')

返回true，但触发不发生，所以我不知道该元素是否被发现。

如果我更改第二个脚本以下，触发取消选中该框不会发生任何

$('#pricing_ab_upload_done_indicator').change(function() 
    { 
     if ($(this).is(':checked')) 
     { 
      console.log("got checked"); 
      $('#pricing_ab_upload_done_indicator').trigger('click'); 
     } 
    });

为什么会触发不会发生呢？

来源

2015-03-25 BOENDAGGER

尝试更改current_form = this;到current_form = $（this）; - 使用jQuery这 – Legendary 2015-03-25 10:02:10

其中current_form使用一切正常（current_form变量用于其他地方也没有显示在这里）。当从第二个脚本调用复选框的触发器函数时，在第一个脚本中调用触发器时，所有问题都可以正常运行 – BOENDAGGER 2015-03-25 10:05:39

请显示相关的HTML。 '＃pricing_ab_upload_done_indicator'和'＃pricing_ab_upload_form'在DOM中同样有效吗？你是否使用任何插件来替换复选框样式的原因（*如果是这样，它点击它时触发原始复选框上的更改事件*）？ – 2015-03-25 10:06:10

很容易，只需删除您的功能和使用下列内容：

$('[id$=_upload_form]').each(function (event) { 
    current_form = this; 

    $(this).fileupload({ 
     done: function (e, data) { 
      var checkbox = $(current_form).find('[id$=_upload_done_indicator]'); 

      // Set the opposite value 
      checkbox.prop("checked", !checkbox.prop("checked")); 
     } 
    }); 
}

避免结合在同一个动作的多个事件。我看到您在复选框上也有.change事件，这将导致"click"事件触发两次。这将使它看起来像什么都没有发生。

在旁注中，如果您经常使用相同的选择器（例如代码示例中的$(current_form).find('[id$=_upload_done_indicator]')），最好将其缓存在变量中以提高性能。编写一个简短的变量名称而不是重复整个选择器也很容易。

来源

2015-03-25 10:08:31

感谢您的答复。第一个脚本是用于一般上传小部件的。我需要能够从不同的页面使用它。上传完成后，需要通知使用上传小部件的页面。我被告知，这样做的最好方法是勾选隐藏的复选框，然后从使用文件上传小部件的页面监听更改事件。在使用事件后，需要将复选框再次切断。因此，建议的结构对我而言不起作用。此外，如果复选框状态为“已检查”，则第二个脚本中的更改事件只会执行某些操作。 – BOENDAGGER 2015-03-25 10:25:08

为什么不直接触发自定义事件？ – 2015-03-25 10:30:34

您可以发表一个示例或其他如何使用自定义事件 – BOENDAGGER 2015-03-25 10:31:56

正在关注@Dark Ashelin的建议，我添加了一个自定义事件。这似乎是实现这种类型功能的更简单和更合理的方式。

在第一个脚本时，上传成功后我有

$(current_form).trigger('event_upload_completed');

中，第二脚本我有

$('#pricing_ab_upload_form').on('event_upload_completed', function() 
{ 
    console.log("Upload completed"); 
});

这种方式并不需要一个回调来从第一个脚本第二个脚本来重置复选框的状态（它根本不需要虚拟html元素）

我在la中测试了这个测试Chrome和FireFox，并在IE11中测试。如果此方法与旧IE兼容性问题请评论此答案

来源

2015-03-25 11:00:29 BOENDAGGER

的JQuery找不到元素

回答

相关问题