代码追加我的img src

时间:2013-05-11 14:09:37

标签: javascript jquery image

我想知道是否有人可以帮助我试图了解我的错误的原因和可能的解决方案。我正在使用JavaSript来加载图像,但是当我测试我的页面时,src属性在.jpg结尾处得到一个/。

我的控制台如下所示:

  • loop:avatars / bugsbunnyundefined
  • loop:avatars / chimchim.jpg /
  • 循环:化身/ christmastree.jpg /
  • loop:avatars / princess.jpg /
  • loop:avatars / squarepants.jpg /
  • loop:avatars / yosemite.jpg /
  • loop:avatars / wilma.jpg /
  • loop:avatars / coatandtie.jpg /
  • loop:avatars / lilymunster.jpg /
  • loop:avatars / georgejetson.jpg /
  • loop:avatars / tweety.jpg /
  • loop:avatars / cleveland.jpg /
    //JavaScript OBJECT 
    var reviews = [
    { Id: "ajjhwejkssl", 
    Title: "The little camera that could!", 
    Rating: 5, Body: "text here",
    CreateDate: new Date(2012,5,23,14,12,10,0),
      Owner: {
        Id: "kwergiueerwq", 
        Name: "Bugs Bunny", 
        Url: "./users.html?id=kwergiueerwq", 
        AvatarImage: "avatars/bugsbunny", 
        IsFeaturedReviewer: false, 
        CreateDate: new Date(2012,2,12,9,44,0,0)
        }
    }]



  var data = reviews;
  var newDiv = null;
  var my_div = null;
  var my_img = null;
  var total = document.getElementById('total');
  var review = $('#reviews');
  $(document).ready(function(){


     for (var i = 0; i < data.length; i++){
       console.log("loop: " + data[i].Owner.AvatarImage + rand);
        var rand = ".jpg/"; 
        rand.replace(rand , ".jpg");

       //CREATE NEW REVIEW DIV
       var reviewPost = "<div class='review'><div class='clear'></div><div class='content'><div class='datePosted'>" + data[i].CreateDate + "</div><div class='avatar'><div class='header'><div class='rating'><img src='images/star-sprite.png'/><img src='images/star-sprite.png'/><img src='images/star-sprite.png'/><img src='images/star-sprite.png'/><img src='images/star-sprite.png'/></div></div><div class='clear'></div><div class='title'>" + data[i].Title + "</div><div class='memberImg'><img class='userImg' src=" + data[i].Owner.AvatarImage + '.jpg'+"/></div><div id='member'><div class='reviewedBy'>Reviewed by <a href='"+data[i].Owner.Url+"' class='member'>" + data[i].Owner.Name + "</a></div><div class='membership'>Member Since " + data[i].Owner.CreateDate + "</div></div></div></div><div class='clear'></div><div class='message'>" + data[i].Body + "</div></div><div class='clear'></div>";

       //adds reviewPost inside of reviews
       review.append(reviewPost);

     $.each(".userImag" , function (){
        //console.log("data: " + data[i].Owner.AvatarImage);
        $(this).attr('src', data[i].Owner.AvatarImage + 'jpg');

    });

     }

  });

3 个答案:

答案 0 :(得分:1)

我认为问题在于

var rand = ".jpg/"; 
rand.replace(rand , ".jpg");

String.replace方法只返回更改后的字符串,但 NOT 更改原始字符串。

String.replace

  

描述

     

此方法不会更改调用它的String对象。它只返回一个新字符串。

答案 1 :(得分:1)

看看这段代码:

console.log("loop: " + data[i].Owner.AvatarImage + rand);
var rand = ".jpg/"; 
rand.replace(rand , ".jpg");

你要添加“+ rand”的第一行没有定义rand。 第二行是设置rand变量 并且第三行几乎被忽略,因为没有为其分配变量。我不认为.jpg /实际上是你图像的来源。

约什

答案 2 :(得分:0)

var rand = ".jpg/"; 
rand.replace(rand , ".jpg");

这根本没有任何意义。您正在为变量赋值并自行替换该变量._ 0

你可能想要这样的东西:

var StringContainingFilePath;
var search = ".jpg/";
var replace = ".jpg";
StringContaingingFilePath = StringContaingingFilePath.replace(search,replace);