在Jquery中附加在Image的src属性中间

时间:2014-03-06 16:44:04

标签: javascript jquery html css image

我有一些代码,我想使用JQuery在我的图像文件名称的开头添加字母“mb”。这对我来说很绿,所以我要求你原谅我的天真。我想要做的一个例子是将我的图像名称从“images / folder / photo.jpg”切换到“images / folder / mb_photo.jpg”。我计划在课堂上使用的图像,所以我可以通过模拟选择那些已经布局的类。我只是坚持如何插入图像标签的中间。

根据要求,到目前为止我所拥有的是:

 $(window).resize(function(){     

         if ($('#content').width() < 700 ){

                      $('#photos_member').;
          $('#photos_group').;
         }

     });

先谢谢你们的帮助。

3 个答案:

答案 0 :(得分:4)

这应该做你需要的......

function updateImageSrc(add) {
    if (add === true) {
        $("img.photos_member:not(.src-modified), img.photos_group:not(.src-modified)")
            .attr("src", function() {
                var split = this.src.split("/");
                split[split.length - 1] = "mb_" + split[split.length - 1];
                return split.join("/");
            })
            .addClass("src-modified");
    }
    else {
        $("img.photos_member.src-modified, img.photos_group.src-modified")
            .attr("src", function() {
                var split = this.src.split("/");
                split[split.length - 1] = split[split.length - 1].substr(3);
                return split.join("/");
            })
            .removeClass("src-modified");
    }
}

要在窗口调整大小处理程序中调用它,请执行此操作...

$(window).resize(function() {
    if ($("#content").width() < 700) {
        updateImageSrc(true);
    }
    else {
        updateImageSrc(false);
    }
});

答案 1 :(得分:1)

使用

<img id="test" src="images/folder/photo.jpg"/>
<input type="button" id="btn" value="change src"/>

$("#btn").click(function(){
var newSrc=$("#test").attr("src").split("/");
newSrc[newSrc.length-1]="mb_"+newSrc[newSrc.length-1];

$("#test").attr("src",newSrc.join());
});

DEMO

答案 2 :(得分:1)

使用replace方法。

var img = "images/folder/photo.jpg";

var newImg = img.replace(/\/(\w+.jpg)/, "/mb_$1");

newImg将包含更新的文件名(“images / folder / mb_photo.jpg”)