HTML
<body>
<header>
<div class="container-fluid">
<h1>Wikipedia Viewer</h1>
<form id="userInput">
<input id="query" type="text" name="userInput" value="" placeholder="Search">
<input id="submitBtn" type="submit" name="send" value="Click!">
</form>
<a id="randomArticle" href="https://en.wikipedia.org/wiki/Special:Random"><i class="fa fa-random fa-2x" aria-hidden="true"></i></a>
</div>
</header>
<div class="results">
</div>
</body>
</html>
Javascript
var url = "https://en.wikipedia.org/w/api.php?action=opensearch&datatype=json&callback=?&search=";
var userQuery = "";
var html = "";
$(document).ready(function () {
$("#userInput").submit(function (e) {
userQuery = document.getElementById("query").value;
$.getJSON(url + userQuery, function (data) {
for (var i = 0; i < data[1].length; i++) {
html = '<article><a href="' + data[3][i] + '"target="_blank"><h3>' + data[1][i] + '</h3><p>' + data[2][i] + '</p></a></article>';
$(".results").append(html);
}
});
});
});
当我到达 .getJSON 时,它不会成功,我已经测试了 URL,并且 JSON 出现在浏览器中,但使用 Jquery 的请求不起作用。
最佳答案
您需要做的就是添加一个 jQuery preventDefault()
按钮单击事件的方法如下:
$(document).ready(function () {
$("#userInput").submit(function (e) {
e.preventDefault();
userQuery = document.getElementById("query").value;
$.getJSON(url + userQuery, function (data) {
for (var i = 0; i < data[1].length; i++) {
html = '<article><a href="' + data[3][i] + '" target="_blank"><h3>' + data[1][i] + '</h3><p>' + data[2][i] + '</p></a></article>';
$(".results").append(html);
}
});
});
});
关于javascript - 即使 URL 有效,.getJSON 也不会成功,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41269084/