如何解决简化Javascript和jQuery搜索脚本
| 我有一个jQuery / JavaScript搜索脚本,其中包括一个选项卡式搜索框。目前,我的代码中有些行是完全不必要的。如何简化下面粘贴的所有代码。 我的HTML代码:<div id=\'nav\'>
<ul>
<li><a href=\'javascript:void(null);\' class=\'type search\'>Web</a></li>
<li><a href=\'javascript:void(null);\' class=\'type images\'>Images</a></li>
<li><a href=\'javascript:void(null);\' class=\'type videos\'>Videos</a></li>
<li><a href=\'javascript:void(null);\' class=\'type news\'>News</a></li>
<li><a href=\'javascript:void(null);\' class=\'type social\'>Social</a></li>
</ul>
</div>
<form id=\'search\' method=\'post\'>
<input type=\'text\' id=\'query\'>
</form>
<div id=\"results\"></div>
我的jQuery / Javascript代码:
$(document).ready(function () {
Tabs.types.init(\'search\');
Tabs.search.init();
});
var Tabs = {
search: {
init: function () {
jQuery(Tabs.element.form).bind(\'submit\',function (evt) {
evt.preventDefault();
});
},submit: function () {
var type = Tabs.types.selected;
},},types: {
init: function (selected) {
Tabs.types.selected = selected;
jQuery(\'.\' + Tabs.types.selected).addClass(\'selected\');
jQuery(Tabs.element.types).bind(\'click\',function () {
Tabs.types.click(jQuery(this));
});
},click: function (obj) {
jQuery(Tabs.element.types).each(function () {
if (jQuery(this).hasClass(\'selected\')) {
jQuery(this).removeClass(\'selected\');
}
});
if (obj.hasClass(\'web\')) Tabs.types.selected = \'search\';
if (obj.hasClass(\'images\')) Tabs.types.selected = \'images\';
if (obj.hasClass(\'videos\')) Tabs.types.selected = \'videos\';
if (obj.hasClass(\'news\')) Tabs.types.selected = \'news\';
if (obj.hasClass(\'social\')) Tabs.types.selected = \'social\';
obj.addClass(\'selected\');
}
},element: {
types: \'.type\',form: \'#search\',};
$(document).ready(function(){
$(\"#query\").keyup(function(e){
if(e.keyCode==13){
var query=$(this).val();
var yt_url=\'\'+Tabs.types.selected+\'.php?q=\'+query;
window.location.hash=\'\'+Tabs.types.selected+\'/\'+query+\'/\';
$.ajax({
type:\"GET\",url:yt_url,dataType:\"html\",success:function(results){
$(\'#results\').html(results);
}
});
}
});
});
解决方法
例如,
您可以统一CSS类和类型,以便仅编写Typs.types.selected = obj.class
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。