[英]SoundCloud: Search & display results using Javascript
我已經在下面創建了代碼，但是無法正常工作。 我在哪里弄錯了，或者忘記了什么？
var search = document.getElementById("search").value; var xhr = new XMLHttpRequest(); function results() { console.log(search); xhr.send() } document.getElementById("results").innerHTML = results(); // Send the XHR xhr.open('GET', 'https://api.soundcloud.com/tracks?client_id=1dff55bf515582dc759594dac5ba46e9&q=" + search;', true);
<html> <head> <!-- JS --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> </head> <body> <input type="search" id="search" /> <button onclick="results()">Search</button> <p id="results"></p> </body> </html>
您的代碼將在頁面加載時運行，但是您想創建一個事件偵聽器，以等待用戶按Search並執行您的請求。
嘗試：
$('#search').click(function(){
var search = document.getElementById("search").value;
var xhr = new XMLHttpRequest();
var results = xhr.open('GET', 'https://api.soundcloud.com/tracks?client_id=1dff55bf515582dc759594dac5ba46e9&q=" + search;', false);
document.getElementById("results").innerHTML = results;
})
xhr請求中的'false'參數阻止代碼異步運行，但是我確定您可以以某種方式使用回調？
弄清楚了...
function audioResults(){ var search = document.getElementById("search").value; var xhr = new XMLHttpRequest(); xhr.open('GET', "https://api.soundcloud.com/tracks?client_id=1dff55bf515582dc759594dac5ba46e9&q=" + search, false); xhr.addEventListener("load", function() { document.getElementById("results").innerHTML = xhr.response; }, false); xhr.send(); }
<html> <head> <!-- JS --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> </head> <body> <input type="search" id="search" /> <button onclick="audioResults()">Search</button> <p id="results"></p> </body> </html>
在MySQL中使用AJAX，Javascript和PHP來顯示搜索結果
[英]Using AJAX, Javascript and PHP with MySQL to display search results
是否可以使用javascript在soundcloud上播放搜索的最高結果
[英]Is it possible to play the top result for a search on soundcloud with javascript
使用php和javascript搜索MYSQL並在同一html表中顯示結果
[英]Search MYSQL and display results inside the same html table using php and javascript
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.