我想根据我单击的字母按钮更改图像源。 我想我需要使用正则表达式,但我不确定它到底应该是什么样子。
<img id="logo_layer2" src="images/logo/logo_compass_a_layer2_red.png">
<ul id="letters">
<li>A</li>
<li>B</li>
<li>C</li>
...
</ul>
“a_layer2”部分应更改为“b_layer2”、“e_layer2”等。
events: {
"click #letters li" : "change_letter"
},
change_letter: function(e) {
var letter = $(e.target).text();
var newimg = /images\/logo\/logo_\w*_\w{1}_layer\d_\w*.png/.replace((/\w{1}/,letter));
$("#logo_layer2").attr("src",newimg);
},
最佳答案
尝试
$('#letters li').click(function(){
var txt =$(this).text().toLowerCase();
$('#logo_layer2').attr('src',function(_,old_src){
return old_src.replace(/_\w_/g,'_'+txt+'_');
});
});
<小时/>
fiddle Demo
$('#letters li').click(function(){
var txt =$(this).text().toLowerCase();
$('#logo_layer2').prop('src',function(_,old_src){
return old_src.replace(/_\w_/g,'_'+txt+'_');
});
});
关于javascript - 使用正则表达式更改img src,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20160770/