html——jQuery练习题2

最新推荐文章于 2022-08-06 08:26:43 发布

原创最新推荐文章于 2022-08-06 08:26:43 发布 · 720 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html #jquery

Windows 同时被 2 个专栏收录

13 篇文章

订阅专栏

HTML

8 篇文章

订阅专栏

这是一个使用jQuery实现的实例，每隔10秒检查文本框中输入的数字与页面上某个div显示的数字是否一致。如果两者不相同，div的内容将被文本框的数字替换。代码中设置了定时器，并利用jQuery的val()和html()方法获取及修改元素内容。

<html>
<head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <title>每间隔10秒检查用户在文本框中输入的数字和层中显示的数字是否相同，如果不同，则用文本框中的数字替换层中显示的数字</title>
                <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
                <script type="text/javascript">
                $(function(){
                        setInterval(function(){
                                var btnmsg=$("#ibtn").val();
                                var divmsg=$("#j1").html();
                                if(btnmsg != divmsg){
                                        $("#j1").html(btnmsg);
                                }
                        },10000);
                });
                </script>
                <style>
                        div{width:200px;height:50px;background: #dfdfef; line-height: 50px; text-align: center;margin: 8px;}
                </style>
        </head>
        <body>
                                <input type="text" id="ibtn" />
                                <div id="j1">10</div>
        </body>
</html>