1

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

我的控制台如下所示：

  • 循环：头像/bugsbunnyundefined
  • 循环：头像/chimchim.jpg/
  • 循环：头像/christmastree.jpg/
  • 循环：头像/princess.jpg/
  • 循环：头像/squarepants.jpg/
  • 循环：头像/yosemite.jpg/
  • 循环：头像/wilma.jpg/
  • 循环：头像/coatandtie.jpg/
  • 循环：头像/lilymunster.jpg/
  • 循环：头像/georgejetson.jpg/
  • 循环：头像/tweety.jpg/
  • 循环：头像/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');

    });

     }

  });
4

3 回答 3

1

我认为问题出在

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

该String.replace方法只返回一个更改的字符串，但不更改原始字符串。

字符串.替换

描述

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

于 2013-05-11T14:25:33.010 回答
1

看看这段代码：

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

您要添加的第一行“+ rand”尚未定义 rand。您正在设置 rand 变量的第二行第三行几乎被忽略了，因为没有为其分配任何变量。我不认为 .jpg/ 实际上在您的图像源中。

乔什

于 2013-05-11T14:26:03.143 回答
0 
var rand = ".jpg/"; 
rand.replace(rand , ".jpg");

这根本没有任何意义。您正在为变量分配一个值并自行替换该变量._0

你可能想要这样的东西：

var StringContainingFilePath;
var search = ".jpg/";
var replace = ".jpg";
StringContaingingFilePath = StringContaingingFilePath.replace(search,replace);
于 2013-05-11T14:20:54.073 回答