用户输入的 reddit 搜索 API 查询

Question

现在我可以利用 reddit API 的搜索功能，我希望用户输入他们自己的查询。我是 javascript 新手，我认为我的代码的问题是 API 搜索功能在用户输入查询之前就已运行。

HTML：

<div id="site-content">
<form name="RedditSearch">
    Enter your query:
    <input type="text" name="query" onkeydown="if (event.keyCode == 13) document.getElementById('search').click()"/>
    <input type="button" id="search" value="Search" onclick="searchquery();" />
</form>    
</div>

Javascript：

var container = $('#site-content')
function searchquery()
{
 var query = document.RedditSearch.query.value;
}
 $.getJSON("http://www.reddit.com/search.json?q=" + query, function(data) {
  $.each(data.data.children, function(i,item){
    var title = item.data.title
    var post = '<div>'+title+'</div>'
    container.append(post)        

});
});

Answer 1

确实，您的 getJSON 查询似乎是在页面加载时执行的。那时用户还没有输入任何东西，所以执行得太早了。

您需要添加一个事件侦听器来检测用户输入，然后对 reddit API 执行 AJAX 调用。

假设您的用户在文本区域输入他的关键字，您可以使用.change()。

您可以在这里了解更多信息：http://api.jquery.com/category/events/‎ 或这里http://www.w3schools.com/jquery/event_change.asp

你的例子：http://jsfiddle.net/2ECG6/1/