javascript - 覆盖jquery中的show方法

Question

正在编辑一个网络应用程序(不是我的代码)，并且当出现一些消息或通知时会显示很多模式 所以我想为该模式添加声音

这个模式存在于整个应用程序中的问题，以及我应该跟踪和添加声音的很多 jquery .show 方法

 $('#ajax_alert').show();

我尝试监听更改，例如 css 属性的更改，但没有成功

$('#ajax_alert').on("change",function(){
//make sound
})

如何覆盖 show 方法？我可以通过检查触发的 id 是否为 ajax_alert 来触发其中的声音，播放该声音!

Answer 1

我同意这样的评论，即这可能不是最好的主意，而且看起来有点老套，但它可以做到。

那么 JQuery .show() 方法所做的只是将元素的 CSS 更改为 display: block; 对吗？因此，您可以覆盖 .show 方法，但告诉它继续这样做，然后添加一些附加功能:

jQuery.fn.show = function() {
   this.css('display', 'block');
   setTimeout(() => alert('My very own added functionality'), 0); // Newly added functionality
   return this;
};

$('a').click(function() {
   $('div').show()
})

div {margin-top: 20px; background-color: blue; height: 60px; width: 60px; display: none;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#">Click to show div</a>
<div></div>

工作 JSFiddle here :