更改jQuery的图像src

我使用此代码更改图像src，但它不工作。如果我的变量文本值写入狐狸例如：更改jQuery的图像src

track = '212'; 
artist = 'azealea banks';

它正在改变过去只图像的src但是当我碰到邻居跨度这个变量的值是不工作的。

我的jQuery代码：

$(function() { 
    $(".plimg").attr("src", 

    function (index) { 
     var title = $(this).next('span.titletrack').text(); 
     alert(title); 
     var array = title.split(' - '); 
     var track = array[0]; 
     var artist = array[1]; 

     var output; 

     $.ajax({ 
      url: "http://ws.audioscrobbler.com/2.0/?method=track.search", 
      data: { 
       track: track, 
       artist: artist, 
       api_key: "ca86a16ce762065a423e20381ccfcdf0", 
       format: "json", 
       lang: "en", 
       limit: 1 
      }, 
      async: false, 
      success: function (data) { 
       output = data.results.trackmatches.track.image[0]["#text"]; 
      } 

     }); 
     return output; 
    }); 
});

和HTML

<div id="playlist" class="scrollable" style="height: 300px;overflow-y: auto"> 
    <li> 
     <img src="/img/playlist/33a - Sulis Vardo.jpg"> 
<span class="titletrack">33a - Sulis Vardo</span> 
    </li> 
    <li> 
     <img class="plimg" src="/img/playlist/33a - Shota.jpg"> 
     <span onclick="playinToplaylist($(this).html());" class="titletrack">33a - Shota</span> 
    </li> 
</div>

来源

2013-08-26 Giorgi Chumburidze

为什么函数里面的函数？这种方式几乎没有用处。只需将iets值设置为一个变量并将其设置为Eeeck的图像 – Martijn

。同步ajax对用户体验非常不利 - 在通话期间锁定浏览器。 – jfriend00

并且你可以用'.each（）来写答案（更正后的代码） –

我做了一些改动。首先，它的唯一找到的最后一个图像，因为只有在你的HTML的最后一个图像有plimg类，所以我补充说：

<div id="playlist" class="scrollable" style="height: 300px;overflow-y: auto"> 
    <li> 
     <img class="plimg"/> 
     <span class="titletrack">33a - Sulis Vardo</span> 
    </li> 
    <li> 
     <img class="plimg"/> 
     <span onclick="playinToplaylist($(this).html());" class="titletrack">33a - Shota</span> 
    </li> 
</div>

其次我已经改变了JavaScript来遍历图像和加载图像来源异步。如果您检查对ajax调用的响应，则为第二个图像传递的详细信息不会返回任何图像数据，所以这就是为什么没有加载该图像数据的原因。

$(function(){ 
    $("img.plimg").each(function() { 
     var img = $(this); 
     var title = img.next("span.titletrack").text(); 
     var titleDetails = title.split(' - '); 
     var track = titleDetails[0]; 
     var artist = titleDetails[1]; 

     $.ajax({ 
      url: "http://ws.audioscrobbler.com/2.0/?method=track.search", 
      data: { 
       track: track, 
       artist: artist, 
       api_key: "ca86a16ce762065a423e20381ccfcdf0", 
       format: "json", 
       lang: "en", 
       limit: 1 
      }, 
      async: true, 
      success: function (data) { 
       var trackData = data.results.trackmatches.track; 
       if(!trackData){ 
        alert("No track data for " + artist + "/" + track); 
        return; 
       } 
       var output = trackData.image[0]["#text"]; 
       img.attr("src", output); 
      } 
     });    
    }); 
});

我把这些更新放在JSFiddle here。

来源

2013-08-26 08:25:56

好方法' – amorbytes

更改jQuery的图像src

回答

相关问题