Question

效果图为http://phplist.xxmn.com/1.jpg

有两个搜索引擎。一个是网站的默认搜索。另一个是谷歌自定义搜索。当游客选择网站的默认搜索时，它应该使用网站的默认搜索。当他们选择谷歌自定义搜索选项时，它应该使用谷歌自定义搜索。

html代码：

   <select class="search_l" >
        <option value="0">the default search</option>
         <option value="1">google search</option>
      </select>

 <form action="/"  accept-charset="UTF-8" method="post" id="search-theme-form"> 
 <div><div id="search" class="container-inline"> 
 <div class="form-item" id="edit-search-theme-form-1-wrapper"> 
 <input type="text" maxlength="128" name="search_theme_form" id="edit-search-theme-form-1" size="15" value="" title="put the search keyword in" class="form-text" /> 
</div> 
<input type="image" name="submit" id="edit-submit"  class="form-submit"    src="images/search_btn_top.gif" /> 
<input type="hidden" name="form_build_id" id="form-2" value="form-f02"  /> 
<input type="hidden" name="form_token" id="edit-search-theme-form-form-token" value="c5a"  /> 
 <input type="hidden" name="form_id" id="edit-search-theme-form" value="search_theme_form"  />

这是网站的默认搜索。我已经添加了一个选择下拉选项。但我不知道如何使用它们。当我选择谷歌搜索时，它应该使用谷歌搜索，当我选择默认搜索时，它应该使用默认搜索。

Answer 1

我认为您需要先在select内加form。然后，根据search_1的值，您可以重定向到http://www.google.com/?q=[the value of search_theme_form]。

编辑：如果你使用的是jQuery，你可以这样做：

jQuery ("#search-theme-form").submit (function () {
  if (jQuery (".search_1").val () == 1) {
    window.location.href = 'http://www.google.com/?q=' + 
      encodeURIComponent (jQuery ("#edit-search-theme-form-1").val ());
  }
  else {
    jQuery ("this").submit();
  }
});

注意：我没有测试过上面的代码。另外，我会将表单元素id属性添加/更改为更有意义的内容，或者至少在select上添加id。

当然，您也可以在表单处理程序代码中实现此行为，这可能更为明智。如果你正在使用PHP，那么这样的东西就可以了（假设你还没有发送页面信息）：

//add 'name="search_target"' to your select element
if ($REQUEST['search_target'] == 1) { 
  header ("Location: http://www.google.com/?q=" . 
    urlencode ($REQUEST['search_theme_form']));
}
else {
  //process local search
}

Answer 2

在select标记中class="search_l"之后，添加id="engine_dd"

然后在id="search-theme-form"之后的表单标记中添加onsubmit="function(){if(document.getElementById('engine_dd').selectedIndex == 1) window.location = document.getElementById('edit-search-theme-form-1').value;}"

我认为这就是你所要求的！祝你好运：）

Answer 3

您可以将onchange事件添加到select标记，该标记会根据用户选择的选项更改表单的action属性。为简化起见，请在服务器端获取select标记的值并重定向到正确的搜索目标

如何在javascript中执行此效果？

3 个答案: