当div变得可见时，jQuery事件触发动作
我在我的网站中使用jQuery，我想在某个div可见时触发某些操作。
是否有可能将某种“不可见”事件处理程序附加到任意div，并在div可见时运行某些代码？
我想要像下面的伪代码：
$(function() {
$('#contentDiv').isvisible(function() {
alert("do something");
});
});
警报（“做某事”）代码不应该在contentDiv实际可见之前触发。
谢谢。
您可以随时添加到原始的.show（）方法中，这样您不必在每次展示内容时都触发事件，或者需要它来处理遗留代码：
Jquery扩展：
jQuery(function($) {
var _oldShow = $.fn.show;
$.fn.show = function(speed, oldCallback) {
return $(this).each(function() {
var obj = $(this),
newCallback = function() {
if ($.isFunction(oldCallback)) {
oldCallback.apply(obj);
}
obj.trigger('afterShow');
};
// you can trigger a before show if you want
obj.trigger('beforeShow');
// now use the old function to show the element passing the new callback
_oldShow.apply(obj, [speed, newCallback]);
});
}
});
用法示例：
jQuery(function($) {
$('#test')
.bind('beforeShow', function() {
alert('beforeShow');
})
.bind('afterShow', function() {
alert('afterShow');
})
.show(1000, function() {
alert('in show callback');
})
.show();
});
这可以让你在执行原始.show（）方法的正常行为的同时，在ShowShow和afterShow之前执行某些操作。
你也可以创建另一个方法，所以你不必重写原始的.show（）方法。
没有本机事件可以为此插入，但是您可以使用.trigger函数使div可见后，从脚本触发事件
例如
//declare event to run when div is visible
function isVisible(){
//do something
}
//hookup the event
$('#someDivId').bind('isVisible', isVisible);
//show div and trigger custom event in callback when div is visible
$('#someDivId').show('slow', function(){
$(this).trigger('isVisible');
});
DOM突变观察者正在解决这个问题。 它们允许你将观察者（一个函数）绑定到改变dom元素的内容，文本或属性的事件。
随着IE11的发布，所有主流浏览器都支持该功能，请查看http://caniuse.com/mutationobserver
示例代码如下所示：
$(function() {
$('#show').click(function() {
$('#testdiv').show();
});
var observer = new MutationObserver(function(mutations) {
alert('Attributes changed!');
});
var target = document.querySelector('#testdiv');
observer.observe(target, {
attributes: true
});
});<div id="testdiv" style="display:none;">hidden</div>
<button id="show">Show hidden div</button>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>上一篇: jQuery event to trigger action when a div is made visible