Question

我正在使用：

<input type="text" class="form-control searchValue">
<a href="#" class="btn btn-default searchButton">Search</a>

以执行搜索。当用户点击搜索时，jQuery必须获取输入的值，然后将用户重定向到页面本身+＆＃34;？search = valueInInput＆＃34;为了使用URL中的GET值在PHP中执行搜索。

为此，我使用了：

$(".searchButton").on("click", function($this){
    var url = location.host + "/index.php?search=" + $(".searchValue").val();
    $(".searchButton").attr("href", url)
 });

问题是用户永远不会被重定向到网址，但我没有放置任何return false或preventDefault，为什么？

如何更改以执行搜索？

Answer 1

这对我有用：

$(".searchButton").on("click", function(){
        var url = "/index.php?search=" + $(".searchValue").val();
        $(".searchButton").attr("href", url)
     });

我删除了$ this和location.host。

Answer 2

这是我最终使用的代码。我认为没有JS可以更好地维护，而且更干净......

<form action="index.php" method="GET">
                <div class="form-group">
                                <input name="search" id="search" type="text" class="form-control searchValue" value="qsdfdf">                                
                </div> 
                <button type="submit" class="btn btn-default">Recherche</button>
                </form>

Answer 3

由于它与您必须重定向到的页面相同，因此您无需考虑URL中的文件名。您也可以使用window对象的location属性：

$(document).ready(function(){
  $(".searchButton").click(function(){
     q = $(".searchValue").val();
      window.location = "?search="+q
  });

});

结帐DEMO

jQuery在单击一个锚元素时处理一个href

3 个答案: