Javascript Jquery ui选项卡ajax内容问题
我正在从事的项目包含大量jquery和jqueryui。在每个页面中都有一个或多个jqueryui选项卡,它们都使用内置的ajax。我有几个问题。 首先,在我使用ajax的几乎每个页面中都有不同的jquery插件,我在每个请求中都反复包含相同的jquery库,这也在我显示选项卡的索引页面中使用。是否有一种方法可以将jquery包含一次,并在我正在绘制的每个ajax页面上使用它。这个问题还会导致几个不同的问题,比如我在不同的选项卡之后单击该选项卡。它不起作用。我在下面放了一些代码,这样你就可以很容易地理解我的问题 ajax/slider.php此页面通过$\u GET获取id,并生成一个我无法在jquery 1.6.2中使用的滑块Javascript Jquery ui选项卡ajax内容问题,javascript,jquery,jquery-ui,jquery-plugins,Javascript,Jquery,Jquery Ui,Jquery Plugins,我正在从事的项目包含大量jquery和jqueryui。在每个页面中都有一个或多个jqueryui选项卡,它们都使用内置的ajax。我有几个问题。 首先,在我使用ajax的几乎每个页面中都有不同的jquery插件,我在每个请求中都反复包含相同的jquery库,这也在我显示选项卡的索引页面中使用。是否有一种方法可以将jquery包含一次,并在我正在绘制的每个ajax页面上使用它。这个问题还会导致几个不同的问题,比如我在不同的选项卡之后单击该选项卡。它不起作用。我在下面放了一些代码,这样你就可以很容
<link rel="stylesheet" type="text/css" href="ajax/advanced-slider.css" media="screen"/>
<script type="text/javascript" src="ajax/jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="ajax/jquery.advancedSlider.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.slider').advancedSlider({
width:600,
height:228,
alignType: 'centerCenter',
hideTimer:true,
effectType:'height',
horizontalSlices:'10',
verticalSlices:'1',
slicePattern:'leftToRight',
slicePoint:'centerBottom',
sliceDuration:'500',
captionSize:'228',
showThumbnails: false,
navigationButtons: false,
navigationArrows: false,
slideshowControls: false });
});
</script>
ajax/gallery.php
<link rel="stylesheet" type="text/css" href="../js/fancybox/jquery.fancybox-1.3.4.css" media="screen"/>
<script type="text/javascript" src="../js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="../js/fancybox/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//$.noConflict(); // (that piece of code sometimes work sometimes doesn't and i have no idea why)
$('a.grouped_elements').fancybox({
titlePosition: 'inside'
});
});
</script>
ajax/g_maps.php
<script type="text/javascript" src="../js/jquery-1.6.2.min.js"></script>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true&key=ABQIAAAAmwC95iK7Tp7hI6hDlNqLhBS5NlhQfHS3VfXEycw6BkztwAjcGBRR3F2hVVVhA0GciYJcjlYGoArYDg" type="text/javascript"></script>
<script type="text/javascript" src="../js/jquery.gmap-1.1.0-min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.noConflict();
$("#maps").gMap({ markers: [{ latitude: <?php echo $maps_x; ?>,
longitude: <?php echo $maps_y; ?>,
html: "<?php echo $maps_adi.'<br />'.$maps_adres; ?>",
popup: true }],
zoom: 16 });
});
</script>
还有我使用的标签页
<link type="text/css" href="css/style.css" rel="stylesheet" />
<link type="text/css" href="css/custom-theme/jquery-ui-1.8.16.custom.css" rel="stylesheet" />
<link type="text/css" href="css/jqueryui-project-spesific.css" rel="stylesheet" />
<link type="text/css" href="js/countdown/jquery.countdown.css" rel="stylesheet" />
<link type="text/css" href="js/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" />
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true&key=ABQIAAAAmwC95iK7Tp7hI6hDlNqLhBS5NlhQfHS3VfXEycw6BkztwAjcGBRR3F2hVVVhA0GciYJcjlYGoArYDg" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/countdown/jquery.countdown.min.js"></script>
<script type="text/javascript" src="js/countdown/jquery.countdown-tr.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.15.custom.min.js"></script>
<script type="text/javascript" src="js/jqueryui-tr.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$( "#tabs" ).tabs({
cache: true,
ajaxOptions: {
error: function( xhr, status, index, anchor ) {
$( anchor.hash ).html(
"Some error message");
}
}
});
});
</script>
我想你会对我的问题有一些想法的。我对js很陌生,所以如果你看到我犯的任何与这个问题无关的错误,请随意发火
如果我有任何错误,我的英语很抱歉
谢谢
编辑:我解决了将ajax页面中js库的相对路径更改为js/的问题。。所以我给出了相对于页面的路径,我称之为ajax,而不是ajax页面本身。但是如果你还有其他的建议,那就太好了。你只需要在主页上有标签的地方加入js,内容是通过ajax加载的,但是它会在同一个页面上,所以同样的js和css会被应用 我经常在我的基本页面上使用它,因为它更有意义,但是,如果你真的需要在每个页面上都使用它,你可以让include服务器端在头上给它一个键,并在添加它之前检查js文件是否还没有被包含