Question

我目前正在做这个

var currentImage = $('#compImg').attr('src');

这将为我提供以下两个网址之一

http://localhost:8000/images/folder1/Yearly/somename_Yearly_something.png
http://localhost:8000/images/folder1/Monthly/somename_Monthly_something.png

唯一的区别是每月和每年。在显示图像的页面上，我有一个选择框，其值为Monthly和Yearly。如果他们选择了某些东西，并且当前没有显示，我需要切换图像。所以说我登陆页面，它正在显示每月图像路径。如果我从选择框中选择每月，则不会发生任何事情。如果我选择Yearly，则应使用Yearly URL替换URL。我认为最好的方法就是将URL中的每月更新替换为每年，因为其余部分是相同的。

目前我有这个：

$( "#yearMonth" ).change(function() {

    var currentImage = $('#compImg').attr('src');

    if($(this).val() == 'Yearly') {
        var newImage1 = currentImage.replace("Monthly", "Yearly");
        $('#dashboardImage').attr('src', newImage1 + '.png');
    }

    if($(this).val() == 'Monthly') {
        var newImage2 = currentImage.replace("Yearly", "Monthly");
        $('#dashboardImage').attr('src', newImage2 + '.png');
    }
});

目前似乎没有任何事情发生。如果需要，我怎样才能替换这个词？

Answer 1

使用.replace(/old/g, "new") - /g部分会点击两个，而不仅仅是第一个。

其次，不要在末尾重新添加.png

更新代码（没有其他重大更改）会给出：

$( "#yearMonth" ).change(function() {

    var currentImage = $('#compImg').attr('src');

    if ($(this).val() == 'Yearly') {
        var newImage1 = currentImage.replace(/Monthly/g, "Yearly");
        // add here: alert(newImage1) to see what it's doing
        $('#dashboardImage').attr('src', newImage1);
    }

    if ($(this).val() == 'Monthly') {
        var newImage2 = currentImage.replace(/Yearly/g, "Monthly");
        $('#dashboardImage').attr('src', newImage2);
    }
});

只是扩展'没有其他重大变化' - 你可以使用正则表达式减少代码：

$('#yearMonth').change(function() {
    var currentImage = $('#compImg').attr('src');
    var newImage = currentImage.replace(/(Monthly|Yearly)/g, $(this).val());
    $('#dashboardImage').attr('src', newImage);
});

你也可以扩展它以从select本身获取值，使代码免于维护。

Answer 2

jQuery中的.replace函数只替换搜索字符串的第一个实例。

您可以使用str.split(search).join(replacement)代替所有实例。（如this thread中所述）

您还应该移除+ .png，因为该网址已经以.png结尾。

然后代码应该工作，看起来像这样：

 $( "#yearMonth" ).change(function() {
     var currentImage = $('#compImg').attr('src');

     if($(this).val() == 'Yearly') {
         var newImage1 = currentImage.split("Monthly").join("Yearly");

         $('#dashboardImage').attr('src', newImage1);
     }

     if($(this).val() == 'Monthly') {
         var newImage2 = currentImage.split("Yearly").join("Monthly");

         $('#dashboardImage').attr('src', newImage2);
     }
 });

替换URL中的字符串实例

2 个答案: