为了账号安全,请及时绑定邮箱和手机立即绑定
<!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>
    <title>show()和hide()方法动画方式显示和隐藏元素</title>
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
</head>
<body>
    <h3>show()和hide()方法动画方式显示和隐藏元素</h3>
    <div>
        <h4>我喜欢吃的水果</h4>
        <ul>
            <li>苹果</li>
            <li>甘桔</li>
            <li>梨</li>
        </ul>
        <input id="hidval" type="hidden" value="0"/>
    </div>
    <script type="text/javascript">
        $(function () {
            $("h4").bind("click", function () {
                if ($("#hidval").val() == 0) {
                  $("ul").show(1500,function(){
                        $("#hidval").val(1);
                    })
                } else {
                    $("ul").hide(1500,function(){
                        $("#hidval").val(0);
                    })
                }
            })
        });
    </script>
</body>
</html>


正在回答

0 回答

举报

0/150
提交
取消
jQuery基础课程
  • 参与学习       154699    人
  • 解答问题       7289    个

加入课程学习,有效提高前端开发速度

进入课程
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号