我在我的网站上使用jQuery,我想在某个div可见时触发某些操作。
是否有可能附加某种“isvisible”事件处理程序到任意div,并有一定的代码运行时,他们的div是可见的?
我想要如下伪代码:
$(function() {
$('#contentDiv').isvisible(function() {
alert("do something");
});
});
警报(“do something”)代码在contentDiv实际可见之前不应该触发。
谢谢。
我在我的网站上使用jQuery,我想在某个div可见时触发某些操作。
是否有可能附加某种“isvisible”事件处理程序到任意div,并有一定的代码运行时,他们的div是可见的?
我想要如下伪代码:
$(function() {
$('#contentDiv').isvisible(function() {
alert("do something");
});
});
警报(“do something”)代码在contentDiv实际可见之前不应该触发。
谢谢。
当前回答
你也可以尝试一下jQuery插件中提到的并行线程https://stackoverflow.com/a/3535028/741782
其他回答
我根据Glenns的想法改变了Catalint的隐藏/显示事件触发器。 我的问题是我有一个模块化的应用程序。我改变模块之间显示和隐藏div父母。然后,当我隐藏一个模块并显示另一个模块时,用他的方法,当我在模块之间更改时,我有一个可见的延迟。我只需要偶尔听一听这件事,而且是在一些特殊的孩子身上。所以我决定用displayObserver类只通知子对象
$.each(["show", "hide", "toggleClass", "addClass", "removeClass"], function () {
var _oldFn = $.fn[this];
$.fn[this] = function () {
var hidden = this.find(".displayObserver:hidden").add(this.filter(":hidden"));
var visible = this.find(".displayObserver:visible").add(this.filter(":visible"));
var result = _oldFn.apply(this, arguments);
hidden.filter(":visible").each(function () {
$(this).triggerHandler("show");
});
visible.filter(":hidden").each(function () {
$(this).triggerHandler("hide");
});
return result;
}
});
然后,当一个孩子想要监听“show”或“hide”事件时,我必须给他添加类“displayObserver”,当它不想继续监听它时,我将他删除类
bindDisplayEvent: function () {
$("#child1").addClass("displayObserver");
$("#child1").off("show", this.onParentShow);
$("#child1").on("show", this.onParentShow);
},
bindDisplayEvent: function () {
$("#child1").removeClass("displayObserver");
$("#child1").off("show", this.onParentShow);
},
我希望得到帮助
使用jQuery Waypoints:
$('#contentDiv').waypoint(function() {
alert('do something');
});
jQuery Waypoints网站上的其他例子。
如果您想在所有实际可见的元素(和子元素)上触发事件,则使用$。show, toggle, toggleClass, addClass,或removeClass:
$.each(["show", "toggle", "toggleClass", "addClass", "removeClass"], function(){
var _oldFn = $.fn[this];
$.fn[this] = function(){
var hidden = this.find(":hidden").add(this.filter(":hidden"));
var result = _oldFn.apply(this, arguments);
hidden.filter(":visible").each(function(){
$(this).triggerHandler("show"); //No bubbling
});
return result;
}
});
现在是元素:
$("#myLazyUl").bind("show", function(){
alert(this);
});
你可以通过将额外的jQuery函数添加到顶部的数组(如“attr”)来添加覆盖。
你可以使用jQuery的Live Query插件。 并编写如下代码:
$('#contentDiv:visible').livequery(function() {
alert("do something");
});
然后每当contentDiv可见时,“do something”就会被提醒!
下面的代码(来自http://maximeparmentier.com/2012/11/06/bind-show-hide-events-with-jquery/)将使您能够使用$('#someDiv')。(“秀”,someFunc);。
(function ($) {
$.each(['show', 'hide'], function (i, ev) {
var el = $.fn[ev];
$.fn[ev] = function () {
this.trigger(ev);
return el.apply(this, arguments);
};
});
})(jQuery);