在jquery切换功能上更改图像 [英] Changing image on jquery toggle function
本文介绍了在jquery切换功能上更改图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
在尝试使用jquery进行切换时,我尝试使用replace命令更改图像.基本显示向下的箭头,在显示内容后变成向下的箭头.以下代码可以正常工作,只是向下箭头没有被替换.
I'm trying to change an image using the replace command when toggling using jquery..basically showing a downward arrrow which becomes an upward arrow after the content is revealed. This following code works except the downward arrow doesn't get replaced.
<img src="/images/arrow_down.png" id="#1" class="nav-toggle">
<div id="1" style="display:none">some content</div>
这是jQuery代码
jQuery('document').ready(function($) {
jQuery('.nav-toggle').click(function() {
var collapse_content_selector = $(this).attr('id');
var toggle_switch = $(this);
$(collapse_content_selector).toggle(function() {
if ($(this).css('display') == 'none') {
} else {
toggle_switch.attr("src").replace("down", "up");
}
});
});
});
推荐答案
您应该使用类似的东西
jQuery('.nav-toggle').click(function() {
var collapse_content_selector = $(this).attr('id');
var toggle_switch = $(this);
$(collapse_content_selector).toggle(function() {
if ($(this).css('display') == 'none') {
toggle_switch.attr("src", toggle_switch.attr("src").replace("image_2.jpg", "image_1.jpg"));
} else {
toggle_switch.attr("src", toggle_switch.attr("src").replace("image_1.jpg", "image_2.jpg"));
}
});
});
此处 是现场演示
这篇关于在jquery切换功能上更改图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文