具体情况:两个js文件jquery-1.1.3.1.js和jquery-1.2.6.pack.js。它们分别在不同的js特效里使用。现在要在同一个页面使用两个特效,结果就冲突了。只有其中的一个特效正常。情况很紧,麻烦各位高手们指点下。小弟,不胜感激!
补充:jQuery.noConflict();这个可以解决吗?如果可以,应该怎样处理好呢?我搞不过来。
补充:jQuery.noConflict();这个可以解决吗?如果可以,应该怎样处理好呢?我搞不过来。
解决方案 »
- ext中用Ext.grid.plugin.RowEditing不能同时保存数据
- 判断图片是否加载完成,用javascript 或 jquery
- 如何使selection.createRange().pasteHTML()功能兼容firefox
- 急~~~~~~~~~~~求一个像http://www.ifeng.com/页面里面效果的层
- 表单验证JS代码
- 捆饶我多日的JS难题!
- 蛙蛙请教:如何获取指定单元格的位置
- 高分求助!js可以实现随机读取一目录下的图片文件吗?
- Aptana studio 3 代码提示不全怎么办?
- 求一个验证1-7200区间正整数的正则表达式
- 工作流可视化
- 求JS raphael 框架教程
2、提取旧版本JQ的那个特效,写成一个新版JQ的扩展插件;
3、提取旧版本JQ的那个特效,改编称自己的函数方法。
4、noConflict():
var wchp = jQuery.noConflict();
// 基于 JQ1.2.6 的代码
wchp ("..........")...............
// 基于JQ1.1.3.1的代码
$("......")..................
<script type="text/javascript" src="js/jquery.linscroll.js"></script>
<script type="text/javascript">
$(document).ready(
function(){
$('#ppic').setScroll( //scrollContent为滚动层的ID
{img:'images/scroll_bk.gif',width:10},//背景图及其宽度
{img:'images/scroll_arrow_up.gif',height:3},//up image
{img:'images/scroll_arrow_down.gif',height:3},//down image
{img:'images/scroll_bar.gif',height:25}//bar image
);});
</script>
<ul class="p_pic">
<!--调用的内容-->
</ul><link href="css/css.css" type="text/css" rel="stylesheet">
<SCRIPT src="js/jquery-1.2.6.pack.js" type=text/javascript></SCRIPT>
<SCRIPT src="js/base.js" type=text/javascript></SCRIPT>
<div id=preview>
<div class=jqzoom id=spec-n1 ><IMG height=392
src="uploadfile/03.jpg" jqimg="uploadfile/03.jpg" width=587>
</div>
<div id=spec-n5>
<div class=control id=spec-left>
<img src="images/left.gif" />
</div>
<div id=spec-list>
<ul class=list-h>
<li><img src="uploadfile/01.jpg"> </li>
<li><img src="uploadfile/02.jpg"> </li>
<li><img src="uploadfile/03.jpg"> </li>
<li><img src="uploadfile/04.jpg"> </li>
<li><img src="uploadfile/05.jpg"> </li>
<li><img src="uploadfile/06.jpg"> </li>
<li><img src="uploadfile/07.jpg"> </li>
<li><img src="uploadfile/01.jpg"> </li>
<li><img src="uploadfile/02.jpg"> </li>
<li><img src="uploadfile/03.jpg"> </li>
<li><img src="uploadfile/04.jpg"> </li>
<li><img src="uploadfile/05.jpg"> </li>
<li><img src="uploadfile/06.jpg"> </li>
<li><img src="uploadfile/07.jpg"> </li>
</ul>
</div>
<div class=control id=spec-right>
<img src="images/right.gif" />
</div>
</div>
</div>
<SCRIPT type=text/javascript>
$(function(){
$(".jqzoom").jqueryzoom({
xzoom:400,
yzoom:400,
offset:10,
position:"right",
preload:1,
lens:1
});
$("#spec-list").jdMarquee({
deriction:"left",
width:587,
height:76,
step:2,
speed:4,
delay:10,
control:true,
_front:"#spec-right",
_back:"#spec-left"
});
$("#spec-list img").bind("mouseover",function(){
var src=$(this).attr("src");
$("#spec-n1 img").eq(0).attr({
src:src.replace("\/n5\/","\/n1\/"),
jqimg:src.replace("\/n5\/","\/n0\/")
});
$(this).css({
"border":"2px solid #ff6600",
"padding":"1px"
});
}).bind("mouseout",function(){
$(this).css({
"border":"1px solid #ccc",
"padding":"2px"
});
});
})
</SCRIPT>
<SCRIPT src="js/lib.js" type=text/javascript></SCRIPT>
<SCRIPT src="js/wwsdh.js" type=text/javascript></SCRIPT>
1)、保留JQ1.2.6 的noConflict():
var wchp = jQuery.noConflict();
// 基于 JQ1.2.6 的代码 实现的特效中,将$改为wchp
wchp ("..........")............... 2)、删除或更名JQ1.1.3.1中的noConflict()
// 基于JQ1.1.3.1的代码 ,继续使用$
$("......")..................
<script type="text/javascript" src="js/jquery-1.1.3.1.js"></script>
<script type="text/javascript" src="js/jquery.linscroll.js"></script>
<script type="text/javascript">
$(document).ready(
function(){
$('#ppic').setScroll( //scrollContent为滚动层的ID
{img:'images/scroll_bk.gif',width:10},//背景图及其宽度
{img:'images/scroll_arrow_up.gif',height:3},//up image
{img:'images/scroll_arrow_down.gif',height:3},//down image
{img:'images/scroll_bar.gif',height:25}//bar image
);});
</script>
<ul class="p_pic">
<!--调用的内容-->
</ul>
<!--==================================这里是基于jquery-1.1.3.1.js的特效 end=====--><!--=========================这里是基于jquery-1.2.6.pack.js的特效 start=====-->
<link href="css/css.css" type="text/css" rel="stylesheet">
<SCRIPT src="js/jquery-1.2.6.pack.js" type=text/javascript></SCRIPT>
<SCRIPT src="js/base.js" type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
var wchp = jQuery.noConflict();
</SCRIPT>
<div id=preview>
<div class=jqzoom id=spec-n1 ><IMG height=392
src="uploadfile/03.jpg" jqimg="uploadfile/03.jpg" width=587>
</div>
<div id=spec-n5>
<div class=control id=spec-left>
<img src="images/left.gif" />
</div>
<div id=spec-list>
<ul class=list-h>
<li><img src="uploadfile/01.jpg"> </li>
<li><img src="uploadfile/02.jpg"> </li>
<li><img src="uploadfile/03.jpg"> </li>
<li><img src="uploadfile/04.jpg"> </li>
<li><img src="uploadfile/05.jpg"> </li>
<li><img src="uploadfile/06.jpg"> </li>
<li><img src="uploadfile/07.jpg"> </li>
<li><img src="uploadfile/01.jpg"> </li>
<li><img src="uploadfile/02.jpg"> </li>
<li><img src="uploadfile/03.jpg"> </li>
<li><img src="uploadfile/04.jpg"> </li>
<li><img src="uploadfile/05.jpg"> </li>
<li><img src="uploadfile/06.jpg"> </li>
<li><img src="uploadfile/07.jpg"> </li>
</ul>
</div>
<div class=control id=spec-right>
<img src="images/right.gif" />
</div>
</div>
</div>
<SCRIPT type=text/javascript>
wchp(function(){
wchp(".jqzoom").jqueryzoom({
xzoom:200,
yzoom:200,
offset:10,
position:"right",
preload:1,
lens:1
});
wchp("#spec-list").jdMarquee({
deriction:"left",
width:587,
height:76,
step:2,
speed:4,
delay:10,
control:true,
_front:"#spec-right",
_back:"#spec-left"
});
wchp("#spec-list img").bind("mouseover",function(){
var src=wchp(this).attr("src");
wchp("#spec-n1 img").eq(0).attr({
src:src.replace("\/n5\/","\/n1\/"),
jqimg:src.replace("\/n5\/","\/n0\/")
});
wchp(this).css({
"border":"2px solid #ff6600",
"padding":"1px"
});
}).bind("mouseout",function(){
wchp(this).css({
"border":"1px solid #ccc",
"padding":"2px"
});
});
})
</SCRIPT>
<SCRIPT src="js/lib.js" type=text/javascript></SCRIPT>
<SCRIPT src="js/wwsdh.js" type=text/javascript></SCRIPT>
<!--=========================这里是基于jquery-1.2.6.pack.js的特效 end=====-->
<XMP>
1、将 jquery-1.1.3.1.js 中的noConflict函数更名
jQuery.extend({
noConflict11111: function() {<<<---------------------------------
if ( jQuery._$ )
$ = jQuery._$;
return jQuery;
},
2、你可以拷贝整个代码;3、删除<script type="text/javascript" src="jquery-1.1.3.1.js"></script>进行测试 4、删除<script type="text/javascript" src="jquery-1.2.6.js"></script>进行测试5、由于jquery-1.2.6.js使用了别名,因此,凡是与jquery-1.2.6.js有关的JS插件都受影响($都要改为别名wchp)
</XMP>
<script type="text/javascript" src="jquery-1.1.3.1.js"></script>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script>
onload=function(){
try{ var wchp=jQuery.noConflict(true); }
catch(e){alert(e.message)}
try{
$("#aa").html("这是jquery-1.1.3.1为DIV赋值的字串;使用的是$符号!");
alert($("#aa").html())
}
catch(e1){alert(e1.message)}
try{
wchp("#aa").html("这是jquery-1.2.6为DIV赋值的字串;使用的是别名wchp!!");
alert($("#aa").html())
}
catch(e2){alert(e2.message)}
}
</script>
try{
wchp("#aa").html("这是jquery-1.2.6为DIV赋值的字串;使用的是别名wchp!!");
alert($("#aa").html())
}
catch(e2){alert(e2.message)}
---------------->>>
try{
wchp("#aa").html("这是jquery-1.2.6为DIV赋值的字串;使用的是别名wchp!!");
alert(wchp("#aa").html())
}
catch(e2){alert(e2.message)}
一个是滚动条的js,一个是图片切换的js。我jq不熟悉,都是网上找的。结果用到一起就冲突了。郁闷啊……还望你可以指点一二。
我觉的讲的有理,有时不能在一颗树上吊死,连toury这样的高手都搞不定,就很难再有人去搞了。
对JQ不熟悉,就不好办哦。继续网上找吧。