$(".sub1 .pic ul li img").each(function(n){//li 下有6个img 选中第一个img 弹出 选好友层 选中一个好友,自动将好友头像替换掉默认img src
$(this).click(function(){
var imgurl;
$(".sub1_1").show();//好友选择层
$(".sub1_1 .agree").click(function(){//点击确定选中一个好友
var friend_inp = $(".friends input[type='radio']:checked")[0].value;
userinfo = friend_inp.split('|*|');
imgurl=userinfo[2];
$(".sub1_1").hide();
$(".sub1 .pic ul li img")[n].src=imgurl;
})
$(this).attr('src',imgurl); //更改图片
alert(n);
})
})
$(this).click(function(){
var imgurl;
$(".sub1_1").show();//好友选择层
$(".sub1_1 .agree").click(function(){//点击确定选中一个好友
var friend_inp = $(".friends input[type='radio']:checked")[0].value;
userinfo = friend_inp.split('|*|');
imgurl=userinfo[2];
$(".sub1_1").hide();
$(".sub1 .pic ul li img")[n].src=imgurl;
})
$(this).attr('src',imgurl); //更改图片
alert(n);
})
})
解决方案 »
- Ext 修改信息时datefield无法赋值问题
- Toggle问题
- Google map API JS实现公交查询
- 求js文字滚动代码
- 请各位高手,帮我看一下这个代码错在那里啊?我找了很久也找不到啊。谢谢!
- 急求:JavaScript如何将file上传到指定文件下,谢谢
- 排列组合问题?
- 在线等 马上结帐:哪里有好点的flash教程啊? 3Q 了 !!
- 有点奇怪的需求要实现,大家帮帮忙,解决则再加100
- <script src=xxx></script>可不可以调用jscript程序的值??
- mouseenter,mouseleave顯示的層input無法選中
- 请问如何给javascript数组元素赋值
var imgurl,index=$(this).index();
$(".sub1_1").show();//好友选择层
$(".sub1_1 .agree").click(function(){//点击确定选中一个好友
var friend_inp = $(".friends input[type='radio']:checked").eq(0).value,
userinfo = friend_inp.split('|*|'),
imgurl=userinfo[2];
$(".sub1_1").hide();
$(".sub1 .pic ul li img").eq(index).attr("src",imgurl);
})
})
这样??不知道你的DOM结构。不确定是否能行但你的用法可以与我上面写的做个参考
<div class="xz1 xz" style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz2 xz" style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz3 xz" style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz4 xz"style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz5 xz"style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz6 xz"style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="pic">
<ul>
<li class="pic1"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li class="pic2"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
</ul>
</div>
<div class="next"></div>
<div class="sub1_1">
<div class="friends">
<ul>
<?php
foreach ($friendlist as $f) {
echo '<li><img src="'.$f['avatar'].'" width="50" height="50" alt="'.$f['screen_name'].'" title="'.$f['screen_name'].'" /><input type="radio" name="userlist[]" value="'.$f['id'].'|*|'.$f['screen_name'].'|*|'.$f['avatar_large'].'" class="x"></li>';
}
?>
</ul>
</div>
<div class="agree"></div>
<h5></h5>
<div class="logo"></div>
</div>
$(".sub1 .pic ul li img").each(function(n){//
}这个的,你是这么测试的么?
出现了一个错误
var imgurl,index=$(this).index();
alert(index);
$(".sub1_1").show();//好友选择层
$(".sub1_1 .agree").click(function(){//点击确定选中一个好友
alert(index);
var friend_inp = $(".friends input[type='radio']:checked").eq(0).value,
userinfo = friend_inp.split('|*|'),
imgurl=userinfo[2];
$(".sub1_1").hide();
$(".sub1 .pic ul li img").eq(index).attr("src",imgurl);
})
})
我不管在里还是外alert(index)得到的值全是0
<script type="text/javascript">
$(function(){
$(".sub1 .pic ul li img").click(function(e){
var imgurl,index=$(this).parent().index(),_that=$(this);
$(".sub1_1").show();//好友选择层
$(".sub1 .pic ul li img").removeAttr("me");
$(this).attr("me","1");
});
$(".sub1_1 .agree").click(function(e){//点击确定选中一个好友
var friend_inp = $(".friends input[type='radio']:checked").val(),
userinfo = friend_inp.split('|*|'),
imgurl=userinfo[2];
$(".sub1_1").hide();
$(".sub1 .pic ul li img[me='1']").attr("src",imgurl);
});
})
</script>
<div class="sub1 w960">
<div class="xz1 xz" style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz2 xz" style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz3 xz" style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz4 xz"style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz5 xz"style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="xz6 xz"style="display:none;"><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/d.jpg" width="22" height="22" alt=""/></div>
<div class="pic">
<ul>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
<li><img src="http://new-img1.ol-img.com/feature/173/2371173/img-subject/sub/11.jpg" width="180" height="180" alt=""></li>
</ul>
</div>
<div class="next"></div>
<div class="sub1_1" style="display:none">
<div class="friends">
<ul>
<li><img src="1.gif" width="50" height="50" alt="a" title="a" /><input type="radio" name="userlist[]" value="1|*|a|*|/b/1.jpg" class="x"></li>
<li><img src="1.gif" width="50" height="50" alt="a" title="a" /><input type="radio" name="userlist[]" value="1|*|a|*|/b/2.jpg" class="x"></li>
<li><img src="1.gif" width="50" height="50" alt="a" title="a" /><input type="radio" name="userlist[]" value="1|*|a|*|/b/3.jpg" class="x"></li>
<li><img src="1.gif" width="50" height="50" alt="a" title="a" /><input type="radio" name="userlist[]" value="1|*|a|*|/b/4.jpg" class="x"></li>
<li><img src="1.gif" width="50" height="50" alt="a" title="a" /><input type="radio" name="userlist[]" value="1|*|a|*|/b/5.jpg" class="x"></li>
<li><img src="1.gif" width="50" height="50" alt="a" title="a" /><input type="radio" name="userlist[]" value="1|*|a|*|/b/6.jpg" class="x"></li>
</ul>
</div>
<div class="agree">确定</div>
<h5></h5>
<div class="logo"></div>
</div>
</div>