I have an input which searcher's google web and another input to search google images. For each input i have buttons to fadeIn either. Can the search input be the same but search different sites?
Here is a fiddle of what I currently have: http://jsfiddle.net/kwC36/
To search the web I use:
<form action="http://开发者_运维技巧google.com/search" method="get" class="websearch">
and to search images I use:
<form action="http://www.google.com/images?hl=en&q=" method="get" class="imagesearch">
Thanks alot
Yeah, you can switch action on the form:
$('.web').click(function(){
$('form')[0].action = "http://google.com/search";
// do something
$('.websearch').fadeIn();
});
$('.image').click(function(){
$('form')[0].action = "http://www.google.com/images?hl=en&q=";
// do something
$('.websearch').fadeIn();
});
Assign custom data attributes to the button so the form action can be dynamic:
HTML:
<form id="search-form" action="" method="get" class="websearch">
<input id="search-field" type="text" class="searcher" name="" />
</form>
<input type="button" value="Search the web" class="search-btn" data-action="http://google.com/search" data-field-name="" />
<input type="button" value="Search images" class="search-btn" data-action="http://www.google.com/images?hl=en&q=" data-field-name="q" />
JQuery:
$('.search-btn').click(function(e){
e.preventDefault();
$('#search-field').attr('name',$(this).data('field-name'));
$('#search-form').attr('action',$(this).data('action')).submit();
});
<input type="submit" name="srch_images" value="Search Images">
<input type="submit" name="srch_google" value="Search Google">
if( isset($_POST['srch_images'] )
{
something();
}
else if( isset($_POST['srch_google']) )
{
something_else();
}
You can use the same textbox to search for web and image. Also there is no need to have two form tags. Try this
$('.web').click(function(){
$('form').attr('action', "http://google.com/search").submit();
});
$('.image').click(function(){
$('form').attr('action', "http://www.google.com/images?hl=en&q=").submit();
});
HTML:
<form action="http://google.com/search" method="get" class="websearch">
<input type="text" class="searcher">
<input type="submit" value="Web Search" class="web">
<input type="submit" value="Image Search" class="image">
</form>
Javascript:
$('.image').click(function() {
$(this).parent()
.attr('action', 'http://www.google.com/images?hl=en&q=');
});
That should do it.
精彩评论