fer*_*xxx 4 jquery internet-explorer
当我点击时togglediv
,commentdiv
必须是可见的或隐藏的.以下代码在Firefox上运行,但不在Internet Explorer上运行:
$(document).ready(function(){
$("#togglediv").click(function(){
if( $("#commentdiv").is(":visible") ) {
$("#commentdiv").hide("slow");
$("#togglediv").text("show");
} else {
$("#commentdiv").show("slow");
$("#togglediv").text("hide");
}
});
});
Run Code Online (Sandbox Code Playgroud)
在jquery中有一个函数切换,可以完全按照您的要求进行操作,而无需检查可见性:
$("#commentdiv").toggle("slow");
Run Code Online (Sandbox Code Playgroud)
我会尝试:
$(document).ready(function() {
$("#togglediv").click(function() {
// note: do this first because the :hidden test fails if you
// do it after triggering a slow animation
$("#togglediv").text($("#commentdiv").is(":hidden") ? "Hide" : "Sgiw");
$("#commentdiv").toggle('slow');
});
});
Run Code Online (Sandbox Code Playgroud)
编辑:为了回应您的评论,此示例在IE7/FF3中完美适用于我. 注意:在使用慢效果时,我确实必须颠倒语句的顺序.有趣!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
#togglediv { padding: 5px; background-color: yellow; }
#commentdiv { padding: 5px; background-color: #CCC; height: 100px; }
</style>
</head>
<body>
<div id="togglediv">Hide</div>
<div id="commentdiv">thanks for answer. but i have tried this code, it was okay. i want to use toggle("slow") effect. this effect is runing firefox, but not i.e. is it a bug?</div>
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript">
$(function() {
$("#togglediv").click(function() {
$("#togglediv").text($("#commentdiv").is(":hidden") ? "Hide" : "Show");
$("#commentdiv").toggle('slow');
});
});
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)