zoukankan      html  css  js  c++  java
  • javascript:jquery.history.js使用方法

    step1:download jquery.history.js

    step2:create a test page as following:

    说明:当页面执行javascript代码后,地址栏能前进和后退。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style type="text/css">
    #mydiv
    {
    border: 1px solid blue;
    400px;
    height: 200px;
    }
    </style>

    <script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery.history.js" type="text/javascript"></script>
    <script type="text/javascript">
    function showMsg(msg) {//you can ajax request
      $('#mydiv').html(msg);
    }
    $(function () {
      $("#link1").bind("click", function () { window.location.hash = "#link1"; });
      $("#link2").bind("click", function () {  window.location.hash = "#link2"; });
      $("#link3").bind("click", function () {  window.location.hash = "#link3"; });

      $.history.init(function (hash) {
        var msg;
        if (hash) {
          msg= hash;
        } 

        else 

        {
         msg= "no set hash value"
        }
        showMsg(msg);
      });
    })
    </script>


    </head>
    <body>
    <input type="button" value="button1" id="link1" />
    <input type="button" value="button2" id="link2" />
    <input type="button" value="button3" id="link3" />
    <hr />
    <div id="mydiv">
    </div>

    </body>

    </html>

  • 相关阅读:
    看完这篇文章,对采用.Net做网站的信心大增
    sqlserver 使用游标存储过程分页
    ViewState慎用
    [zz] C++智能指针循环引用解决
    cello 有关trigger
    cello 把事件全部统一起来,Event,StateEvent,ActionEvent
    libvirt 错误FAQ
    cello collector中为什么要设置frame_work_in_machine
    比较好的一些句型
    一些疑问
  • 原文地址:https://www.cnblogs.com/tuolin/p/1901439.html
Copyright © 2011-2022 走看看