jQuery - .toggle（）在页面加载时触发

Question

当我点击目录一词时，向上箭头图像必须更改为向下，反之亦然，再次点击。

在此代码中，当页面加载时，触发切换。

$('#direct').click(function(){
     $('#arrow').attr('src','images/down_arrow_black.gif');
});


<div id="direct"><img src="images/up_arrow_black.gif" id="arrow" />Directory</div>

由于 让

Answer 1

我使用.toggle()方法进行切换工作，$()确保正确加载：

$(function() {
    $('#direct').toggle(function(){
        $('#arrow').attr('src','images/down_arrow_black.gif');
    }, function() {
        $('#arrow').attr('src','images/up_arrow_black.gif');
    });
});

Answer 2

如果您的jQuery包含在以下内容中？

$(document).ready(function() {
    ....
})

Answer 3

将其包裹在

中

$(document).ready(function() {
    // your toggle code
});

Answer 4

如果您使用的是jQuery 1.4

你可以这样做......

$('#direct').click(function(){
   $('#arrow').attr('src',function(i,src){            
        return src.indexOf('down')?'images/up_arrow_black.gif':'images/down_arrow_black.gif';
   });
});