动态jquery地址使用搜索按钮

Dynamic jquery address using search button

本文关键字:搜索 按钮 jquery 地址 动态      更新时间:2023-09-26

我试图使用http://www.asual.com/jquery/address/进行历史管理,当我们在"a"标签上工作时,这绝对有效,但现在我有搜索模块,当我点击搜索按钮时触发,我试图在地址(以及页码)中包含搜索文本,这样当用户使用后退按钮时,他/她也可以看到他们以前做过什么搜索。如有任何帮助,我将不胜感激。

编辑:参考资料- http://www.asual.com/jquery/address/

我正在构建AJAX应用程序,所以所有的模块都使用AJAX加载,并保持历史的跟踪,我使用:http://www.asual.com/jquery/address/,直到现在所有的链接都是"a"的href,我编码为公共

现在,我工作在搜索页面搜索框和searchButton,所以当用户输入文本框,点击searchButton, url必须相应地调整当用户直接输入(或涉及到该url使用后退按钮),应该显示搜索结果,这类似于gmail的"搜索邮件"按钮,请注意url是如何改变,我也试图实现同样的事情。希望你明白,谢谢。


我相信你正在寻找类似于这个例子的东西。

简化的例子:

<html>
<head>
    <title>jQuery Address Form</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.address.js"></script>
    <script type="text/javascript">
        $.address.init(function(event) {
            $('form').address();
        })
        .change(function(e) {
            // for anything that isn't homepage
            if (e.value != '/') {
                // load results for url in e.value, for example:
                $("#results").load(e.value);
            }
        })
    </script>
</head>
<body>
    <div class="page">
        <h1>jQuery Address Form</h1>
        <form action="find.php" method="get">
            <label for="input">Query</label><br>
            <input id="input" name="input" type="text" value="" size="60"/>
            <input id="submit" name="submit" type="submit" value="Submit"/>
        </form>
        <div id="results">
        </div>
    </div>
</body>
</html>

当您提交表单时,url正在更改。然后由我的代码处理更改事件。 e。值在本例中是一个url,所以当url改变时,我们试图将搜索结果加载到#resultsdiv中。当用户在他/她的浏览器中使用"返回"按钮导航时,使用相同的更改处理程序。

有一个完整的jQuery插件,叫做jQuery BBQ:后退按钮&查询库。试试这个demo,看看是不是你需要的。