javascript - 仅当类存在时才执行加载窗口
问题描述
$(window).on('load', function()
只有当某个类存在于 DOM 元素 (div) 中时,我才需要执行。
我目前的代码如下:
jQuery(document).ready(function($) {
if (window.innerWidth > 767) {
var $sticky = $('#sticky');
var $stickyrStopper = $('.footer');
if (!!$sticky.offset()) { // make sure ".sticky" element exists
var generalSidebarHeight = $sticky.innerHeight();
var stickyTop = $sticky.offset().top;
var stickOffset = 0;
var stickyStopperPosition = $stickyrStopper.offset().top;
var stopPoint = stickyStopperPosition - generalSidebarHeight - stickOffset;
var diff = stopPoint + stickOffset;
$(window).scroll(function(){ // scroll event
var windowTop = $(window).scrollTop(); // returns number
//////////////
if (stopPoint < windowTop) {
$sticky.css({ position: 'absolute', top: diff });
} else if (stickyTop < windowTop+stickOffset) {
$sticky.css({ position: 'fixed', top: stickOffset });
} else {
$sticky.css({position: 'absolute', top: 'initial'});
}/////////////
});
}
}
});
这是我的想法,如果类存在:
jQuery(document).ready(function($) {
if (window.innerWidth > 767) {
if ($(".classexists")[0]){
元素在哪里:
<div class="classexists">123</div>
在主函数之前执行window on load
函数:
$(window).on('load', function() {
如果 class 不存在,则不实际执行 a $(window).on('load', function() {
,只需正常执行其余代码即可。
此代码应该创建一个粘性侧边栏。
解决方案
如果我正确理解您的问题,请尝试以下操作:
function example() {
var $sticky = jQuery('#sticky');
var $stickyrStopper = jQuery('.footer');
if (!!$sticky.offset()) { // make sure ".sticky" element exists
var generalSidebarHeight = $sticky.innerHeight();
var stickyTop = $sticky.offset().top;
var stickOffset = 0;
var stickyStopperPosition = $stickyrStopper.offset().top;
var stopPoint = stickyStopperPosition - generalSidebarHeight - stickOffset;
var diff = stopPoint + stickOffset;
jQuery(window).scroll(function () { // scroll event
var windowTop = jQuery(window).scrollTop(); // returns number
//////////////
if (stopPoint < windowTop) {
$sticky.css({ position: 'absolute', top: diff });
} else if (stickyTop < windowTop + stickOffset) {
$sticky.css({ position: 'fixed', top: stickOffset });
} else {
$sticky.css({ position: 'absolute', top: 'initial' });
}/////////////
});
}
}
if (window.innerWidth > 767) {
if (jQuery('.classexists').length > 0) {
jQuery(window).on('load', function () {
example();
});
} else {
example();
}
}