jQuery-Funktion wird beim Klicken auf die Schaltfläche ausgeführt und Enter / Return (Taste)
Ich versuche ein kleines Suchfeld zu erstellen, mit dem Sie anhand des von Ihnen in das Eingabefeld eingegebenen Suchbegriffs nach Twitter suchen können. Während es funktioniert, funktioniert es nur, wenn Sie auf die Schaltfläche Senden klicken. Ich möchte auch die Eingabetaste drücken können, um die Suche zu starten. Ich habe versucht, die .sumbit-Funktion zu verwenden und meine Eingabe ohne Erfolg um ein Formularelement zu wickeln. Jede Einsicht wäre sehr dankbar!
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(document).ready(function(){
function(data) {
$('#startSearch').click(function(){
$('#tweets .results').remove();
var searchTerm = 'http://search.twitter.com/search.json?q=' + $('#twitterSearch').val() + '&callback=?'
$.getJSON(searchTerm, function(data) {
$.each(data.results, function() {
$('<div class="results"></div>')
.hide()
.append('<a class="userPicLink" href="http://twitter.com/' + this.from_user + '">' + '<img class="userImg" src="' + this.profile_image_url + '">' + '</a>')
.append('<span class="userName">' + '<a href="http://twitter.com/' + this.from_user + '">' + this.from_user + '</span>')
.append('<span class="userText">' + this.text + '</span>')
.append('<time class="textTime">' + relTime(this.created_at) + '</time>')
.appendTo('#tweets')
.fadeIn();
});
});
</script>
<body>
<label id="searchLabel" for="twitterSearch">Search</label>
<input type="search" list="searchSugg" id="twitterSearch" placeholder="css3 animation" required aria-required="true">
<input id="startSearch" type="submit">
<datalist id="searchSugg">
<option value="css3 mulitple backgrounds">
<option value="html5 video">
<option value="responsive web design">
<option value="twitter api">
</datalist>
<div id="tweets">
</div>
</body>