html 요소에 추가 할 때 jQuery "undefined"가 인쇄됩니다.

Question

jQuery MP3 플레이어를 만들고 있습니다. 노래 구조는 첫 번째 (노래에 대한 정보 포함)를 생성 한 다음 구조는 다음과 같이 jQuery를 사용하여 사업부에 추가됩니다 :

는

function loadFromPlaylist(playlist) { 
    var songsStructure; 

    for (var i=0; i<playlist.length; i++) { 
     songsStructure += 
     "<div id='song" + i + "'>" + 
      "<span class='mpPlaylistArtist'>" + playlist[i].artist + "</span>" + 
      "<span class='mpPlaylistSong'>" + playlist[i].song + "</span>" + 
      "<span class='mpPlaylistAlbum'>" + playlist[i].album + "</span>" + 
     "</div>"; 
    } 

    $('#mpTracks').append(songsStructure); 
} 

이 한 가지를 제외하고 완벽하게 작동합니다.

<div id="mpTracks"> 
    "undefined" 
    <div id="song0">...</div> 
    <div id="song1">...</div> 
</div> 

이 문제가 관련 문제가 많이 나왔고 인터넷 검색을하지만 나에게 도움이되지 않았다 : 항목이 브라우저에 표시 될 때, 문자열 ("정의되지 않은")는과 같이, 노래 위에 인쇄되어 있습니다.

문제가 무엇인지 아는 사람이 있습니까?

Answer 1

사용하기 전에, 빈 문자열로 변수를 초기화 :이 undefined로 설정되도록

var songsStructure = ''; 

당신은, 초기 값을 설정하지 않았다. 연결을위한 JS 규칙에 따르면이 undefined은 결과로 이어지는 for 루프에 의해 생성 된 문자열로 연결됩니다.

Answer 2

songsStructure 변수를 초기화해야합니다.

쓰기

function loadFromPlaylist(playlist) { 
     var songsStructure=""; 

하고 문제가 해결 될 것입니다.