搜索带有 jQuery 的项目,按回车键后页面将重定向到所选项目 link
Search in items with jQuery and after pressing enter page will redirect to selected item link
我用jQuery做了一个搜索插件。
当用户在搜索项目后在搜索输入中按 enter 键时,我需要将页面重定向到所选项目 href
。
jQuery.expr[':'].contains = function (a, i, m) {
return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};
jQuery(function ($) {
$('input[name="search"]').keyup(function () {
var searchterm = $(this).val();
if (searchterm.length > 1) {
var match = $('.item_name:contains("' + searchterm + '")');
var nomatch = $('.item_name:not(:contains("' + searchterm + '"))');
match.addClass('selected');
nomatch.addClass('uk-hidden');
} else {
$('.item_name').removeClass('uk-hidden');
$('.item_name').removeClass('selected');
}
});
var statematch = $('.item_name:contains("استان")');
statematch.remove().parent();
});
.uk-hidden{
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="uk-search">
<input class="uk-search-field" type="search" name="search" placeholder="search here">
</div>
<div class="ad-city-list">
<div class="item_name"><a href="tehran.html">Tehran</a></div>
<div class="item_name"><a href="istanbul.html">Istanbul</a></div>
<div class="item_name"><a href="tabriz.html">Tabriz</a></div>
</div>
我该怎么做?
试试这个:
jQuery.expr[':'].contains = function(a,i,m){
return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
jQuery(function($) {
$('input[name="search"]').keyup(function(){
var searchterm = $(this).val();
if(searchterm.length >1) {
var match = $('.item_name:contains("' + searchterm + '")');
var nomatch = $('.item_name:not(:contains("' + searchterm + '"))');
match.addClass('selected');
nomatch.addClass('uk-hidden');
} else {
$('.item_name').removeClass('uk-hidden');
$('.item_name').removeClass('selected');
}
});
var statematch = $('.item_name:contains("استان")');
statematch.remove().parent();
$(document).keypress(function(e) {
if(e.which == 13) {
var url1 = $('.item_name.selected:not(.uk-hidden) a').attr('href');
$(window.location).attr('href', url1);
}
});
});
使用下面的代码。
$('input[name="search"]').bind('keypress', function(e) {
var code = e.keyCode || e.which;
if(code == 13) { //Enter keycode
var href = $(".ad-city-list").find(".selected:first").find("a:first").attr("href");
if(href)
window.location.href = href;
}
});
我用jQuery做了一个搜索插件。
当用户在搜索项目后在搜索输入中按 enter 键时,我需要将页面重定向到所选项目 href
。
jQuery.expr[':'].contains = function (a, i, m) {
return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};
jQuery(function ($) {
$('input[name="search"]').keyup(function () {
var searchterm = $(this).val();
if (searchterm.length > 1) {
var match = $('.item_name:contains("' + searchterm + '")');
var nomatch = $('.item_name:not(:contains("' + searchterm + '"))');
match.addClass('selected');
nomatch.addClass('uk-hidden');
} else {
$('.item_name').removeClass('uk-hidden');
$('.item_name').removeClass('selected');
}
});
var statematch = $('.item_name:contains("استان")');
statematch.remove().parent();
});
.uk-hidden{
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="uk-search">
<input class="uk-search-field" type="search" name="search" placeholder="search here">
</div>
<div class="ad-city-list">
<div class="item_name"><a href="tehran.html">Tehran</a></div>
<div class="item_name"><a href="istanbul.html">Istanbul</a></div>
<div class="item_name"><a href="tabriz.html">Tabriz</a></div>
</div>
我该怎么做?
试试这个:
jQuery.expr[':'].contains = function(a,i,m){
return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
jQuery(function($) {
$('input[name="search"]').keyup(function(){
var searchterm = $(this).val();
if(searchterm.length >1) {
var match = $('.item_name:contains("' + searchterm + '")');
var nomatch = $('.item_name:not(:contains("' + searchterm + '"))');
match.addClass('selected');
nomatch.addClass('uk-hidden');
} else {
$('.item_name').removeClass('uk-hidden');
$('.item_name').removeClass('selected');
}
});
var statematch = $('.item_name:contains("استان")');
statematch.remove().parent();
$(document).keypress(function(e) {
if(e.which == 13) {
var url1 = $('.item_name.selected:not(.uk-hidden) a').attr('href');
$(window.location).attr('href', url1);
}
});
});
使用下面的代码。
$('input[name="search"]').bind('keypress', function(e) {
var code = e.keyCode || e.which;
if(code == 13) { //Enter keycode
var href = $(".ad-city-list").find(".selected:first").find("a:first").attr("href");
if(href)
window.location.href = href;
}
});