Question

在我的WordPress页面上，有两个jQuery脚本，如下所示：

1）

jQuery(document).ready(function($){
$('.some_class').on('click',function(event){
event.preventDefault();
console.log('work 1');
//some custom work here
});
});

2）

jQuery(document).ready(function($){
$('.some_class').on('click',function(event){
event.preventDefault();
console.log('work 2');
//some custom work here
});
});

在上面两个代码中，你可以看到在同一个类上我做了两个不同的自定义工作，但第一个代码已经出现在页面上，第二个代码是在某个php条件下添加的。

现在我希望如果添加第二个代码，则不应该执行第一个代码，只应执行第二个代码。但在我的情况下，第一个被执行，它根本不考虑第二个。

我还想补充一点，它是一个WordPress页面，第一个代码添加在自定义钩子上，它位于页脚之前（位于页面中间的某个位置），第二个代码添加在wp_footer钩子上

有人可以帮我解决这个问题。

Answer 1

在添加第二个动态脚本时，您可以使用jQuery off函数禁用该类的任何现有点击处理程序：

$('.some_class').off('click');

点击此处了解详情：http://api.jquery.com/off/

请注意，我给出的示例将取消绑定该类中的所有点击事件，如果您有其他处理程序也将其绑定。要取消绑定只有1个处理程序，您还必须传递对该原始函数的引用。

Answer 2

你可以使用全局变量ie。 var changed = 0;如果将第二个加载到页面上，则其值应更改为1。当它在全球范围内发生时，第一个函数不会与if一起发生。

＆＃13;

var changed = 0;

jQuery(document).ready(function($){
if(changed == 0){
  $('.some_class').on('click',function(event){
    event.preventDefault();
    console.log('work 1');
    //some custom work here
  });
}
});

jQuery(document).ready(function($){
  changed = 1;
  $('.some_class').on('click',function(event){
    event.preventDefault();
    console.log('work 2');
    //some custom work here
  });
});

＆＃13;

简单的工作示例：

＆＃13;

var used = 0;

function one(){
  if(used == 0){
    alert("click");
  }
}
function two(){
  used = 1;
  one(); 
  alert("two");
}

＆＃13;

<input onClick="one();" type="button" value="Call one" />
<input onClick="two();" type="button" value="Call two" />

＆＃13;

Answer 3

您可以将处理程序的“工作”部分移动到新函数：

jQuery(document).ready(function($){
    $('.some_class').on('click',function(event){
        event.preventDefault();
        do_custom_work();
    });
});

function do_custom_work() {
    //some custom work here
    console.log("1 default work");
}

然后在您的可选代码中覆盖此函数：

function do_custom_work() {
    console.log("2 overridden work");
}

因此，只有一个事件处理程序（使用preventDefault），它将调用do_custom_work，这将是最后加载的文件（如您的方案中所述）。

如何覆盖jQuery执行的行为？

3 个答案: