<div class='container'>
<br><br><br>
<div class="input-group">
<input type="text" class="form-control" placeholder="WikiWhat?" name="search-term" id="search-term">
<div class="input-group-btn">
<button class="btn btn-default" id="search-button"><i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
<ul id="results"></ul>
</div>
/*Downloaded from https://www.codeseek.co/tropicalchancer/wikisearchious-rLgWkY */
/*Downloaded from https://www.codeseek.co/tropicalchancer/wikisearchious-rLgWkY */
$(document).ready(function() {
//COLLECTS INPUT
$("#search-term").val('');
$("#search-term").keyup(function () {
var q = $("#search-term").val();
//REQUESTS API
$.getJSON("http://en.wikipedia.org/w/api.php?callback=?", {
srsearch: q,
action: "query",
list: "search",
format: "json"
},
//SEARCH RESULTS aka DO STUFF
function (data) {
//CLEAR HTML
$("#results").empty();
//ADD TO HTML "WIKI FOR SEARCHINPUT"
$("#results").append("Wiki for: " + q + "");
//GO THRU JSON DATA AND APPEND WHAT WE WANT TO HTML
$.each(data.query.search, function (i, item) {
$("#results").append("<h1><a href='http://en.wikipedia.org/wiki/" + encodeURIComponent(item.title) + "' target='_blank'>" + item.title + "</a><br>" + item.snippet + "</h1>");
});
});
});
//DON'T KNOW WHAT EXACTLY THIS DOES
$('#search-button').on("click", function() {
$("#search-term").val('');
});
});
Bootstrap
Angular
ReactJS
jQuery
VueJS
HTML
CSS
JavaScript
