我的页面顶部有一个图像滑块，下面是我的产品，问题是当我使用选择框对产品进行排序时，由于滑块重新加载并重置为第一张幻灯片，页面会闪烁。我希望产品可以在没有滑块重新加载的情况下进行排序并再次重置为第一张幻灯片？我已经阅读了很多关于闪烁的主题，但我对javascript和php相当新，我还在苦苦挣扎
以下代码来自productlist.php文件，其中有3个包含在body标签，标题，滑块和产品列表中调用。
另外......由于某种原因，如果页面底部的两个调用脚本与头部中的其他脚本一起放置，则滑块会中断。我没有回答为什么会这样。
?><?php
// GLOBAL INCLUDES
require_once("Application.php");
?>
<!DOCTYPE html>
<html>
<head>
<title>Product Listings | <?php echo $_ENV["request.cwpage"]["title"]; ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Description" content="<?php echo ((isset($_ENV["request.cwpage"]["description"])) ? $_ENV["request.cwpage"]["description"] : "" ); ?>">
<?php // CARTWEAVER CSS ?>
<!--- START CARTWEVER CORE CSS --->
<link href="cw4/css/cw-core.css" rel="stylesheet" type="text/css">
<!--- END CARTWEVER CORE CSS --->
<!--- START HEADER CSS --->
<link href="cw4/style_sheets/header.css" rel="stylesheet" type="text/css">
<!--- END HEADER CSS --->
<!--- START LINKS FOR PP_slider --->
<link rel="stylesheet" type="text/css" href="cw4/style_sheets/container_p2.css" />
<link rel="stylesheet" type="text/css" href="cw4/style_sheets/customer_info_panel.css" />
<link rel="stylesheet" type="text/css" href="cw4/style_sheets/slit_slider_style_2.css" />
<link rel="stylesheet" type="text/css" href="cw4/style_sheets/slit_slider_style_custom_2.css" />
<link rel="stylesheet" type="text/css" href="cw4/style_sheets/customer_info_panel.css" />
<link rel="stylesheet" type="text/css" href="cw4/style_sheets/share_tab_2.css" />
<script type="text/javascript" src="cw4/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="cw4/js/modernizr.custom.79639.js"></script>
<noscript><link rel="stylesheet" type="text/css" href="cw4/style_sheets/slit_slider_styleNoJS.css" /></noscript>
<script type="text/javascript" src="cw4/js/jquery.ba-cond.min.js"></script>
<script type="text/javascript" src="cw4/js/jquery.slitslider.js"></script>
<script type="text/javascript">
$(function() {
var Page = (function() {
var $nav = $( '#nav-dots > span' ),
slitslider = $( '#slider' ).slitslider( {
onBeforeChange : function( slide, pos ) {
$nav.removeClass( 'nav-dot-current' );
$nav.eq( pos ).addClass( 'nav-dot-current' );
}
} ),
init = function() {
initEvents();
},
initEvents = function() {
$nav.each( function( i ) {
$( this ).on( 'click', function( event ) {
var $dot = $( this );
if( !slitslider.isActive() ) {
$nav.removeClass( 'nav-dot-current' );
$dot.addClass( 'nav-dot-current' );
}
slitslider.jump( i + 1 );
return false;
} );
} );
};
return { init : init };
})();
Page.init();
});
</script>
<!--- END LINKS FOR PP_slider --->
</head>
<body class="cw">
<!--- Server Side Include for the site header --->
<?php include('_cw4-tmplt-ft1_header-include.php');?>
<!--- Server Side Include for pp_slider --->
<?php include('_cw4-tmplt-ft1_pp_slider-include.php');?>
<?php
// CARTWEAVER INCLUDE: product details
include("cw4/cw-productlist.php");
?>
</body>
<script type="text/javascript" src="cw4/js/showhide.js"></script>
<script src="cw4/js/styleswitch.js" type="text/javascript"></script>
</html