2011-06-25 8 views
0

私は、タブ付き検索ボックスを含むjQuery/Javascript検索スクリプトを持っています。現在、コードには完全に不要な行があります。私が下に貼り付けたすべてのコードをどのように単純化することができますか? JavascriptとjQueryの検索スクリプトの簡略化

私の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); 
       } 
      }); 
     } 
    }); 
}); 
+0

これはまったく間違っています。if(obj.hasClass( 'web'))Tabs.types.selected = 'search'; ' – mplungjan

答えて

0

、あなただけTyps.types.selected書くことができますので、あなたはCSSクラスや種類を統一することができます = obj.class

+0

あなたはカスタムhtml属性を使用できます。 search_type = "images" –

+0

Tabs.types.selected = obj.attr( 'search_type'); –