php - Fixing jQuery instant search script tabs -


i have google instant style jquery script uses jquery tab script define search type user wants. currently, no matter tab link click on query web.php?q=query. why be?

<script type="text/javascript"> $(document).ready(function(){     $("#query").keyup(function(){             var query=$(this).val();             var type=$("a").attr("id");             var yt_url=''+type+'.php?q='+query;             window.location.hash=''+type+'/'+query+'/';             $.ajax({                 type:"get",                 url:yt_url,                 datatype:"html",                 success:function(results){                    $('#results').html(results);                 }             });     }); }); </script>  <ul> <li><a href='javascript:void(null);' id="web">web</a></li> <li><a href='javascript:void(null);' id="images">images</a></li> <li><a href='javascript:void(null);' id="videos">videos</a></li> <li><a href='javascript:void(null);' id="news">news</a></li> <li><a href='javascript:void(null);' id="social">social</a></li> </ul>  <input type='text' id='query'> <div id="results"></div> 

you need differentiate clicks keyup. need store request url , change when tabs clicked, need seperate url , data request.

so js be:

  $(document).ready(function(){     $("#query").keyup(function(){             var query=$(this).val();             var type='web' //substitute text, default whatever             var yt_url=type+'.html';             alert(yt_url);             window.location.hash=''+type+'/'+query+'/';             $.ajax({                 type:"get",                 url:yt_url,                 data: type+"="+query,                 error: function(a,b,c,d)                 {                     $("#results").html("a:"+a+"b: "+b+" c "+c);                 },                 datatype:"html",                 success:function(results){                    console.log("result"+results);                 }             });     });  $("a").click(function() {  var query=$("#query").val();             var type=$(this).attr('id');             var yt_url=type+'.html';              window.location.hash=''+type+'/'+query+'/'; $.ajax({                 type:"get",                 url:yt_url,                 data: type+"="+query,                 error: function(a,b,c,d)                 {                     console.log("a:"+a+"b: "+b+" c "+c);                 },                 datatype:"html",                 success:function(results){                    console.log("result"+results);                 }             }); }) }); 

Comments

Popular posts from this blog

c++ - Is it possible to compile a VST on linux? -

java - Output of Eclipse is rubbish -

jquery - Confused with JSON data and normal data in Django ajax request -