jquery .show（）和后退按钮

我想弄清楚如何让我的网页看起来一样，当用户返回使用后退按钮。在我的示例中，单击一个复选框，然后单击它显示的URL。一旦你到达谷歌或雅虎，点击后退按钮，并注意到网址不再显示。复选框仍然被选中，但没有网址。jquery .show（）和后退按钮

<html> 
<head> 
<title></title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
</head> 
<body> 

<script type="text/javascript"> 
$(document).ready(function() { 
     $("#googlelink").hide(); 
     $("#yahoolink").hide(); 

     $("#google").click(function() { 
      if($('#google:checked').length) { 
       $("#googlelink").show(); 
      } else { 
       $("#googlelink").hide(); 
      } 
     }); 

     $("#yahoo").click(function() { 
      if($('#yahoo:checked').length) { 
       $("#yahoolink").show(); 
      } else { 
       $("#yahoolink").hide(); 
      } 
     }); 
    }) 
</script> 

<div class="check"> 
<p><input type="checkbox" value="google" id="google" /> 
    <label for="google">show google link</label></p> 
<p><input type="checkbox" value="yahoo" id="yahoo" /> 
    <label for="yahoo">show yahoo link</label></p> 
</div> 

<div id="googlelink"><a href="http://google.com">google.com</a> </div> 
<div id="yahoolink"> <a href="http://yahoo.com">yahoo.com</a></div> 

</body> 
</html>

来源

2012-09-27 user584583

您可以缩小代码并触发DOMReady上的更改事件。

$(document).ready(function() { 
    $("#googlelink, #yahoolink").hide(); 

    $("input[type=checkbox]").on('change', function() { 
      var id = '#' + this.id + 'link'; 
      $(id).css('display', this.checked ? 'block' : 'none'); 
    }).change(); 

    //$("input[type=checkbox]").each(function() { 
    // var id = '#' + this.id + 'link'; 
    // $(id).css('display', this.checked ? 'block' : 'none'); 
    //}) 
})

来源

2012-09-27 02:15:06 undefined

这听起来像浏览器的行为。例如，Chrome浏览器通常会在页面之间前后移动时清空所有文本字段，即使设置了表单中的某些选项。

来源

2012-09-27 02:11:37 L0j1k

jquery .show（）和后退按钮

回答

相关问题