切换表和图标

时间:2014-03-19 13:00:49

标签: jquery html

我有一个脚本可以帮助我切换我的表但是它失败了icon。所以请帮我修改一下。在这里,我在点击后获取类名,最后我正在执行切换操作。

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
function alok(obj){
var s= $(obj).attr('class');

$("."+s+":not(:first)").toggle(function() {
$('.'+s).children("img").attr("src","http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/ExpandSign.gif");
}, function() {
    $('.'+s).children("img").attr("src","http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/CollapseSign.gif");
});
}
</script>
</head>
<body>

<table>
<tr  class="b" onclick=alok(this)><td><img src="http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/CollapseSign.gif">qw</td></tr>
<tr  class="b"><td>alok</td></tr>
<tr  class="b"><td>verma</td></tr>
<tr  class="c" onclick=alok(this)><td>qw</td></tr>
<tr  class="c"><td>alok</td></tr>
<tr  class="c"><td>verma</td></tr>

</table>

</body>
</html>

3 个答案:

答案 0 :(得分:0)

试试这个,

function alok(obj){
   var s= $(obj).attr('class');
   var $img=$('.'+s).find("img");
   var src=($img.attr("src")=='http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/ExpandSign.gif') ?
        'http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/CollapseSign.gif':
        'http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/ExpandSign.gif';
   $img.attr("src",src);
}

答案 1 :(得分:0)

你需要使用&#39; find&#39;不是孩子&#39;孩子&#39;只需检查一个级别,而找到更深的

<script>
function alok(obj){
var s= $(obj).attr('class');

$("."+s+":not(:first)").toggle(function() {
$('.'+s).find("img").attr("src","http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/ExpandSign.gif");
}, function() {
        $('.'+s).find("img").attr("src","http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/CollapseSign.gif");
});
}
</script>

答案 2 :(得分:0)

尝试这种方法。

function alok(obj){
var s = $(obj).attr('class');

    if( !$(obj).hasClass('collapse') ){
        $(obj).children().children("img").attr("src","http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/ExpandSign.gif");
        $(obj).addClass('collapse');
    } else {
        $(obj).children().children("img").attr("src","http://prtlimages.cunamutual.com/ImageServer/Portal/B2B/CollapseSign.gif");
        $(obj).removeClass('collapse');
    }

}