javascript - Pixabay API 始终显示相同的结果

Question

我使用下面的代码和搜索字段(输入)来从 Pixabay 获取结果。无论我在搜索中使用什么关键字，我总是得到相同的 5 个结果(参见附图)。我缺少什么？非常感谢任何帮助!

var API_KEY = 'my_hidden_api_key',
		searchTerm,
		submitSearch = $('#cms_pixaSearchBtn'),
		boxPixaResults = $('#cms_displayPixaResults'),
		URL = "https://pixabay.com/api/?key="+API_KEY+"&safesearch=true&q="+encodeURIComponent(searchTerm);
	
	
	
	submitSearch.click(function(){
		searchTerm = $('#cms_pixaSearchKeywords').val();
		console.log(searchTerm);
		
		$.getJSON(URL, function(data){
		if (parseInt(data.totalHits) > 0)
			$.each(data.hits, function(i, hit){ 
				console.log(hit.pageURL); 
				boxPixaResults.append('<img src="' + hit.previewURL + '" alt="">');
			});
		else
			console.log('No hits');
		});	
	}); 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<input id="cms_pixaSearchKeywords" type="text" value="">		
<input id="cms_pixaSearchBtn" type="button" value="search">

<div id="cms_displayPixaResults"></div>

Answer 1

URL = "https://pixabay.com/api/?key="+API_KEY+"&safesearch=true&q="+encodeURIComponent(searchTerm);

在调用点击处理程序之前定义:

submitSearch.click(function(){
        searchTerm = $('#cms_pixaSearchKeywords').val();

所以 searchTerm 为空。

并根据documentation如果 q 为空，您将获得所有图像。

修复:

submitSearch.click(function(){
        searchTerm = $('#cms_pixaSearchKeywords').val();
        URL = "https://pixabay.com/api/?key="+API_KEY+"&safesearch=true&q="+encodeURIComponent(searchTerm);