트랙 검색 Last.fm JSON API with jQuery AJAX

Last.FM의 트랙 검색을 다시 작성하려고하지만 내 사이트에서 jQuery와 AJAX를 사용하려고합니다. 그래서 내 생각은 Last.FM의 JSON API를 통해 데이터를 가져 와서 텍스트 입력 요소 데이터를 전달하는 것입니다. 예를 들어 사용자는 "Rolling Stones Horses"를 넣고 제출을 클릭합니다. jQuery는 "Rolling Stones Horses"를 문자열 http://ws.audioscrobbler.com/2.0/?method=track.search&track=Rolling%20Stones%20Horses&api_key=b25b959554ed76058ac220b7b2e0a026&format=json&callback=에 전달하겠습니까? 그럼 내가 검색 양식, AJAX 및해서 getJSON 함께 사용하는 방법에 조각 같이하기 위해 노력하고있어트랙 검색 Last.fm JSON API with jQuery AJAX

<P> ARTIST NAME - TRACK </P>

으로 HTML로 결과를 뱉어 것입니다. 여기까지 내가 가지고있는 것 :

<body> 
    <form action="/wphmusic/" id="searchForm"> 
    <input type="text" name="s" placeholder="Search..." /> 
    <input type="submit" value="Search" /> 
    </form> 

    <div id="result"></div> 

<script type="text/javascript"> 

$("#searchForm").submit(function(event) { 

event.preventDefault(); 

var $form = $(this), 
    term = $form.find('input[name="s"]').val(), 
    url = $form.attr('action'); 
}); 

var fmurl = 'http://ws.audioscrobbler.com/2.0/?method=track.search&track=' + url + '&api_key=b25b959554ed76058ac220b7b2e0a026&format=json&callback=?'; 
$.getJSON(fmurl, function(data) { 
    var html = ''; 
    $.each(data.results.trackmatches.track, function(i, item) { 
     html += "<p>" + item.name + " - " + item.artist + "</p>"; 
}); 
    $('#result').append(html); 

</script> 
</body>

슈퍼 신품 이쪽!

출처

2012-02-02 Besto

getJSON 호출에서 대괄호가 누락 된 것처럼 보이지만 작동해야합니다.

출처

2012-08-01 00:26:58 Zach

encodeURIComponent()와 같은 것을 사용하여 URL 문자열로 전달할 데이터를 인코딩해야합니다. – Zach

트랙 검색 Last.fm JSON API with jQuery AJAX

답변

관련 문제