0

我试图弄清楚如何在单击后和页面重新加载后保留按钮单击状态。在我的代码中，我使用了一个 onclick 事件，所以如果我需要添加另一个事件，我可以这样做......只是想弄清楚如何保持点击状态。感谢任何时间的帮助，谢谢。

<html>
<head>

<style type="text/css">
#sub3 {
position: absolute;
left: 100px;
top: 200px;
background-color: #f1f1f1;
width: 180px;
padding: 10px;
color: black;
border: #0000cc 2px dashed;
display: none;
}
</style>

<script language="JavaScript">
function setVisibility(id, visibility) {
document.getElementById(id).style.display = visibility;
}
</script>

</head>
<body >

<input id="input1" type=button value='Show Layer' onclick="setVisibility('sub3', 'inline');";>

<div id="sub3">Message Box</div>

</body>
</html>
4

2 回答 2

0

因为 JavaScript 是客户端，所以每次刷新页面时都会丢失用户点击事件等信息。

假设有特定原因需要刷新页面并且不能使用 Ajax，您可以通过在单击时设置 cookie 来完成您想要的操作，然后检查在下一页加载时是否单击了该 cookie。

这是在 JavaScript 中设置/检索 cookie 的一个很好的入门。如果您愿意，还有一个很好的Jquery 插件。

本质上，在您的onclick调用中，您将调用一个函数，该函数为 cookie 设置一个值并执行您的 setVisiblity 函数。

function clicked(id, visibility) {
    setVisibility(id, visibility);
    setCookie() // this calls your set cookie function
    return true;
}

在页面加载时，您将拥有一个检查您刚刚设置的 cookie 是否存在的功能。如果是这样，那么您可以再次调用 setVisibility 函数来更改按钮的样式。

于 2012-11-17T07:39:53.480 回答
0

有一个用于设置 cookie 的 javascript 函数 使用这些片段来设置和获取 cookie 值

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);
    }
  }
}

这两个函数都来自w3schools 教程

于 2012-11-17T07:34:24.727 回答