使用 jQuery 偵測可見性變化
使用動態內容時,有必要根據特定元素的可見性執行操作。 jQuery 提供了一種方法來附加在 div 可見時觸發的事件處理程序。
解決方案:
要實現此目的,您可以擴展現有的 jQuery .show()可見性變化前後的方法和觸發事件。下面是一個自訂擴充程式碼片段:
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'); }; // Trigger beforeShow event obj.trigger('beforeShow'); // Call the original show method with the new callback _oldShow.apply(obj, [speed, newCallback]); }); } });
用法:
要使用擴充的.show() 方法,您可以將事件綁定到beforeShow和afterShow 觸發器。例如:
jQuery(function($) { $('#test') .bind('beforeShow', function() { alert('beforeShow'); }) .bind('afterShow', function() { alert('afterShow'); }) .show(1000, function() { alert('in show callback'); }) .show(); });
此程式碼會在 ID 為 test 的 div 顯示和隱藏時觸發 beforeShow 和 afterShow 事件,讓您根據可見性變更執行自訂程式碼。
以上是如何檢測 jQuery 中元素的可見性變化?的詳細內容。更多資訊請關注PHP中文網其他相關文章!