Javascript iPad Safari按钮突出显示问题

Javascript iPad Safari按钮突出显示问题,javascript,jquery,css,html,Javascript,Jquery,Css,Html,我有一个Div,当点击时,我希望它改变颜色,然后链接改变页面。我已成功使用setTimeout()使页面更改自动生效。我目前正在使用css突出显示带有:活动状态的按钮 使用此选项时,高光是喜怒无常的,不会产生预期效果。目前,我还必须使用ontouchstart=“”,才能使其正常工作 有谁能建议一个更好的方法,让div在一段时间内改变颜色,然后改变页面 提前谢谢 更新: 我使用的代码大致如下: <style type="text/css"> #button_RH_Pg1{ backg

我有一个Div,当点击时,我希望它改变颜色,然后链接改变页面。我已成功使用setTimeout()使页面更改自动生效。我目前正在使用css突出显示带有:活动状态的按钮

使用此选项时,高光是喜怒无常的,不会产生预期效果。目前,我还必须使用ontouchstart=“”,才能使其正常工作

有谁能建议一个更好的方法,让div在一段时间内改变颜色,然后改变页面

提前谢谢

更新:

我使用的代码大致如下:

<style type="text/css">
#button_RH_Pg1{
background-color:#FF0000;
padding:10px;
text-align:center;
font-weight:bold;
color:#FFFFFF;
font-family:arial;
cursor:hand;
}   
#button_RH_Pg1:active{
background-color:#000000;
}   
 </style>
 <script>
 function page2load(){
document.getElementById('page1dis').style.display="none";
document.getElementById('page2dis').style.display="block";
}
</script>
<div id="page1dis">
<div id="button_RH_Pg1" onclick="page2load()">This is a button</div>
</div>

#按钮_右侧_Pg1{
背景色:#FF0000;
填充:10px;
文本对齐:居中;
字体大小:粗体;
颜色:#FFFFFF;
字体系列:arial;
光标:手;
}   
#按钮\u右侧\u Pg1:激活{
背景色:#000000;
}   
函数page2load(){
document.getElementById('page1dis').style.display=“无”;
document.getElementById('page2dis').style.display=“block”;
}
这是一个按钮

右侧分区按钮{
背景色:#FF0000;
填充:10px;
文本对齐:居中;
字体大小:粗体;
颜色:#FFFFFF;
字体系列:arial;
光标:手;
}
无功延迟=500;
功能页面加载(按钮,目标页面){
button.style.backgroundColor=“#000000”;
setTimeout(函数(){
button.parentNode.style.display=“无”;
document.getElementById(targetpage).style.display=“block”;
button.style.backgroundColor=“#FF0000”;
},延误);
}
这是一个按钮

如果没有看到代码,我们就无能为力……出于好奇,我们刚刚用示例代码进行了更新,为什么不为链接使用一个标准?它是平板电脑的单页应用程序。因此,它不是一个20页的页面,而是一个包含多个隐藏div的页面,一次显示一个div
<style type="text/css">
div.button_RH {
  background-color: #FF0000;
  padding: 10px;
  text-align: center;
  font-weight: bold;
  color: #FFFFFF;
  font-family: arial;
  cursor: hand;
}
</style>
<script>
var delay = 500;
function pageload(button, targetpage) {
  button.style.backgroundColor = "#000000";
  setTimeout(function() {
    button.parentNode.style.display = "none";
    document.getElementById(targetpage).style.display = "block";
    button.style.backgroundColor = "#FF0000";
  }, delay);
}
</script>
<div id="page1dis">
  <div class="button_RH" onclick="pageload(this, 'page2dis')">
    This is a button
  </div>
</div>