跨两个脚本共享事件或使用更改将可见性状态作为事件触发器

Question

好吧，我在这里迷路了。 我在这里和其他地方都读过许多文章，其中涉及如何检查给定元素的状态的主题，尤其是它是可见的还是隐藏的，以及使状态改变触发事件。 但是我无法使任何建议的解决方案起作用。

首先，由于每个人似乎首先都跳上了这一点，因此，由于我有一个jQuery脚本可处理以可点击状态显示svg图标，因此需要进行此操作。 还有一个已经具有通过单击图标使表单可见时执行相关操作的功能，显然我想重复使用这些功能。

我尝试过的

最初，我尝试将两个脚本都作用于单击事件（这仍然是理想的解决方案）。

脚本1：

 $(".booked").on("click", function() {
         $("#cancellation_Form_Wrapper").css("visibility","visible");
 }).svg({loadURL: '../_public/_icons/booked.svg'});


Script 2:

 $(".booked").on("click", function() {
 // do stuff
 });

这没有用，所以我试图研究在两个脚本之间共享一个事件，但是无法在这个主题上取得任何进展，所以我尝试触发另一个事件以使第二个脚本开始工作。

脚本1：

 $(".booked").on("click", function() {
         $("#cancellation_Form_Wrapper").css("visibility","visible");
         $("#cancellation_Form_Wrapper").trigger("change");
 }).svg({loadURL: '../_public/_icons/booked.svg'});

剧本2

 $("#cancellation_Form_Wrapper").on("change", function(event){
    // do stuff
 });

这没有再次起作用，我不清楚为什么它没有达到预期的效果。

然后我尝试了is（：visible）....

脚本1

 $(".booked").on("click", function() {
         $("#cancellation_Form_Wrapper").css("visibility","visible");
 }).svg({loadURL: '../_public/_icons/booked.svg'});

剧本2

 $("#cancellation_Form_Wrapper").is(":visible", function(){
 // do stuff
 });

所以我有点迷路。 理想的情况是回到第一个概念。 我不明白为什么两个脚本都无法处理svg上的click事件。 我认为这与事件处理程序有关，但是我不确定如何修改脚本，以便它们都拾取相同的事件。

无法使用可见性状态更改这一事实来触发操作。

欢迎任何指导。

编辑好吧，我刚刚解决了与脚本2从脚本1.悲伤拿起触发事件说，这是我的一个基本的错误问题...的形式防止警报的显示。 但是我仍然不能使is（：visible）工作。

Answer 1

您的语法可能已关闭：

$("#cancellation_Form_Wrapper").is(":visible", function(){
    // do stuff
});

应该：

if($("#cancellation_Form_Wrapper").is(":visible")){
    // do stuff
});

编辑：如果您希望在使div可见后发生某些事情，则可能要使用show（）回调而不是切换可见性：

$('#cancellation_Form_Wrapper').show(timeInMilliseconds, function(){
    // do something
});

但是，这需要在相同的功能中进行，我认为这不会提高您的位置。

问题可能是您的第二个on()脚本与第一个脚本同时触发，这意味着包装器尚不可见。 您可以尝试在较短的超时时间内包装第二个on() ：

$(".booked").on("click", function() {
    setTimeout(function(){
        if($("#cancellation_Form_Wrapper").is(":visible")){
            // do stuff
        });
    }, 100);
});

这应该引入足够的延迟，以确保在尝试执行第二条语句之前已经显示了包装器。