[英]not working jquery in a ajax loaded part
i loaded some pages ajax with Ajaxtabs and i used in pages jquery & owl carousel but after load parts ,jquery doesn't work and givenot owl classes and styles to divs. 我用Ajaxtabs加载了一些页面ajax,我在页面jquery和owl carousel中使用但是在加载部件之后,jquery不起作用并且给了div的owl类和样式。
my home page: 我的主页:
<div class="tabsbar">
<ul id="countrytabs" class="tabsheader container">
<li><a href="#" rel="#default" class="selected">first tab no ajax</a></li>
<li><a href="one.php" rel="countrycontainer">test tab ajax</a></li>
<li><a href="two.php" rel="countrycontainer">test tab ajax</a></li>
<li><a href="three.php" rel="countrycontainer">test tab ajax</a></li>
</ul>
</div>
<div id="countrydivcontainer" class="tabsbody">
<p>first tab content that no ajax</p>
</div>
one.php & two.php & three.php are my wordpress custom pages link one.php&two.php&three.php是我的wordpress自定义页面链接
in one.php : 在one.php中:
<?php /* Template Name: CustomPage1 */ ?>
<div class="products">
<?php
$args = array( 'post_type' => 'product', 'posts_per_page' => 10, 'product_cat' => 'print', 'orderby' => 'rand' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<div class="product item">
<a href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">
<?php woocommerce_show_product_sale_flash( $post, $product ); ?>
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="287px" height="227px" />'; ?>
<h3><?php the_title(); ?></h3>
<span class="price"><?php echo $product->get_price_html(); ?></span>
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</div>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</div>
<script type='text/javascript'>
$(document).ready(function(){
$('.products').owlCarousel({
loop:true,
responsiveClass:true,
responsive:{
0:{
items:2,
},
768:{
items:4,
},
992:{
items:6,
}
}
});
});
</script>
as you see i saved 10 woocommerce post in a page and i want load it as ajax, the html codes loaded good but the jquery doesnot work on this ajax loaded parts. 如你所见,我在一个页面中保存了10个woocommerce帖子,我想加载它作为ajax,html代码加载好,但jquery不适用于这个ajax加载的部分。
another Weird problem when i place the carousel in first tab in #countrydivcontainer that is not ajax for first view in browser work correctly but when i switched between tabs and load another parts and come back to first tab, this also not working. 另一个奇怪的问题当我将轮播放在#countrydivcontainer中的第一个标签中时,浏览器中的第一个视图不是ajax正常工作但是当我在标签之间切换并加载其他部件并返回第一个标签时,这也无效。
检查你是否正在调用最新的jQuery
check also that you have added wp_head(); in header.php and wp_fooer(); in footer.php
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.