Question

我正在尝试这个并且我的背景改变颜色（我想要的）但输入的src仅在我第二次点击时改变。如何在第一次点击时更改源？另外如何通过第二次点击将src更改回原始文件？

<input id="showHideContainer" type="image" src="on.png " height="3%" width="2%" alt="On" onclick="toggle();">

<script>
document.getElementById('showHideContainer').onclick = function () {
divTest = document.getElementById('header');
if (divTest.style.display === "none") {
    divTest.style.display = 'block';
} else {
    divTest.style.display = "none";
};
$('body').toggleClass('style2');
$('#showHideContainer').click(function(){
$('#showHideContainer').attr('src', 'off.png');
});
}
</script>

Answer 1

您需要确定obj的当前状态，然后将其与其他

切换

$('#showHideContainer').click(function(){
    var off = $(this).attr('src').indexOf('off.png')>-1;
    $(this).attr('src', (off?'on.png':'off.png'));
});

Answer 2

快速修复。您现在在第一次单击#showHideContainer时附加了anoter事件处理程序，这就是它第一次没有触发的原因。这个修剪过的代码版本可以获得预期的结果，另请参阅另一个答案来查看元素属性的状态：

 document.getElementById('showHideContainer').onclick = function () {
        divTest = document.getElementById('header');
        if (divTest.style.display === "none") {
            divTest.style.display = 'block';
        } else {
            divTest.style.display = "none";
        };
        $('body').toggleClass('style2');
        var off = $(this).attr('src').indexOf('off.png')>-1;
        $(this).attr('src', (off?'on.png':'off.png'));
    }

如何通过onclick使输入更改其src？

2 个答案: