为jquery设置一个全局变量以跨越多个页面

时间:2013-03-22 00:35:05

标签: javascript jquery menu

好的,这就是我需要做的。不确定如何做到这一点。我有一个运行index.php的php页面是我的主页面,它加载并引入menu.php和其他一些子文件。所以这是我的问题。我有一个用java编写的下拉菜单,然后我还链接了一个Jquery脚本来生成页面的标题。发生的事情是,当我点击菜单中的链接时,它会显示标题一分钟然后消失,因为它会转到新页面。如果我添加一个返回false,它的停止和工作,但当然不会转发到新页面。所以这是我的问题。我需要设置一个变量im假设或者某个东西来保存点击的值并将其带到新页面,我不知道该怎么做。这是我的菜单代码。

<!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>


  <link rel="stylesheet" type="text/css" href="main.css" />
  <link rel="stylesheet" type="text/css" href="css/default.css">
  <link rel="stylesheet" type="text/css" href="css/css-slider.css">
  <script type="text/javascript" src="Scripts/jquery-1.7.1.js"></script>
    <script src="css/active.js" type="text/javascript">
  </script> 
    <script src="css/drop1.js" type="text/javascript">
  </script> 

  </script>


<!--Main Navigation Start -->

  <div id="nav" class="nav">
  <ul id="sddm">
  <li><a class="navigation" value="home" id="Home" href="index.php" onMouseOver="mopen('m1')" onMouseOut="mclosetime()">Home</a>
  <div id="m1" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  </div>
  </li>
  <li><a class="navigation" id="Station History" href="station_history.php" onMouseOver="mopen('m2')" onMouseOut="mclosetime()">Station History</a>
  <div id="m2" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  </div>
  </li>
  <li>
  <a class="navigation" id="Apparatus" href="Apparatus.php" onMouseOver="mopen('m3')" onMouseOut="mclosetime()">Apparatus</a>
  <div id="m3" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  <a class="navigation" id="Truck History" href="truck_history.php">Truck History</a> 
  </div>
  </li>
  <li>
  <a class="navigation" id="Photo Gallery" href="photos.php" onMouseOver="mopen('m4')" onMouseOut="mclosetime()">Photos</a>
  <div id="m4" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  </div>
  </li>
  <li>
  <a class="navigation" id="News & Events" href="news_events.php" onMouseOver="mopen('m5')" onMouseOut="mclosetime()">News & Events</a>
  <div id="m5" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  </div>
  </li>
  <li>
  <a class="navigation" id="Station Members" href="Station_members.php" onMouseOver="mopen('m6')" onMouseOut="mclosetime()">Station Members</a>
  <div id="m6" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  </div>
  </li>
  <li>
  <a class="navigation" id="Education" href="education.php" onMouseOver="mopen('m7')" onMouseOut="mclosetime()">Education</a>
  <div id="m7" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> 
  <a class="navigation" id="Station Tours" href="">Station Tours</a>
  <a class="navigation" id="Fire Extinguisher" href="">Fire Extinguisher</a>
  <a class="navigation" id="First Aid & CPR" href="">First Aid & CPR</a>
  <a class="navigation" id="Smoke Alarms" href="">Smoke Alarms</a> 
  </div>
  </li>
  <li>
  <a class="navigation" id="Contact Us" href="contactus.php" onMouseOver="mopen('m8')" onMouseOut="mclosetime()">Contact Us</a>
  <div id="m8" onMouseOver="mcancelclosetime()" onMouseOut="mclosetime()"> </div>
  </li>
  </ul>
  </div>
  </div>

</body>
</html>

<!DOCTYPE html>

这是我的Jquery

//navigation 

$(document).ready(function () {

    //var mname = ($(this).attr('id'));
    $("a.navigation").click(function () {
        //alert($(this).attr('id'));
        $("span#title").html($(this).attr('id'));


    })
});

这是我的下拉

      <!--
  var timeout         = 500;
  var closetimer    = 0;
  var ddmenuitem      = 0;

// open hidden layer
function mopen(id)
{ 
  // cancel close timer
  mcancelclosetime();

  // close old layer
  if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';

  // get new layer and show it
  ddmenuitem = document.getElementById(id);
  ddmenuitem.style.visibility = 'visible';

}
// close showed layer
function mclose()
{
  if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
}

// go close timer
function mclosetime()
{
  closetimer = window.setTimeout(mclose, timeout);
}

// cancel close timer
function mcancelclosetime()
{
  if(closetimer)
  {
    window.clearTimeout(closetimer);
    closetimer = null;
  }
}

// close layer when click-out
document.onclick = mclose; 
// -->

由于某些原因,我完全没有理由这样做,真的很感激帮助。

2 个答案:

答案 0 :(得分:2)

全局变量仅在给定页面的生命周期内持续,因此它们不会持续多个页面。因此,要将数据从一个页面传递到另一个页面,您必须将数据存储在浏览器或服务器中的某个位置,以便后续页面可以检索它。

您在浏览器中存储或传递数据的选项包括:

  1. 将数据存储在cookie中,然后在后续页面上从cookie中检索它。
  2. 将数据存储在本地存储中,然后在后续页面上从本地存储中检索。
  3. 进入下一页时,对您要访问的URL中的数据进行编码(作为查询参数或哈希值,然后在下一页中使用javascript从URL中检索该数据。
  4. 选项1和2最适合大量页面需要访问的数据。所有浏览器的所有版本都支持Cookie(但有时用户会阻止它们)。本地存储是一个更简洁的API,并且在所有现代浏览器中都受支持,但在某些旧版浏览器中不受支持。每个域可以存储的数据量在Cookie中比本地存储更受限制。

    请注意,选项1和2仅适用于同一域中的网页。无法在存储数据的域之外访问Cookie和本地存储。

    请参阅this article on MDN阅读/编写Cookie。

    有关读取/写入本地存储的信息,请参阅this article on MDN,包括在本地存储不可用时回退到cookie的兼容性库。

答案 1 :(得分:0)

使用Cookies!这是一些Javascript:

function setCookie(c_name, value, exdays) {
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
    document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name){
    var i,x,y,ARRcookies = document.cookie.split(";");
    for (i = 0; i < ARRcookies.length; i++)
    {
      x = ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
      y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
      x = x.replace(/^\s+|\s+$/g,"");
      if (x == c_name)
        {
        return unescape(y);
        }
    }

}