利用定时器实现双向数据绑定效果

最新推荐文章于 2024-07-18 08:31:26 发布

原创最新推荐文章于 2024-07-18 08:31:26 发布 · 2.9k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#数据

web前端学习专栏收录该内容

301 篇文章

订阅专栏

本文介绍了一个简单的网页示例，通过使用jQuery库实现文本框输入内容的实时更新显示。当用户在文本框中输入文字时，间隔10毫秒后旁边段落的内容将自动更新为文本框中的内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里写图片描述

<!doctype html>
<html lang="en">

    <head>
        <meta charset="UTF-8" />
        <script type="text/javascript" src="js/jquery-3.0.0.js"></script>
        <title>Document</title>
        <script type="text/javascript">
            $(function() {
                setInterval(function() {
                    $("p.p").text($("input").val());
                }, 10)
            })
        </script>
    </head>

    <body>
        <p>
            <input type="text" class="main" />
        </p>
        <p class="p">
            0
        </p>
    </body>

</html>