js原生和jQuery绑定事件

逐渐心动

于 2022-07-04 11:18:27 发布

阅读量127

点赞数

文章标签： javascript jquery 前端

本文链接：https://blog.youkuaiyun.com/weixin_44701385/article/details/125596422

版权

本文通过一个简单的示例对比了使用原生JavaScript和jQuery进行事件绑定的方法。介绍了如何在用户离开输入框时捕获输入值并显示，同时触发警告提示。适合初学者了解这两种常用前端技术的基本用法。

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

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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>原生和jQuery绑定事件</title>
    <script src="js/jquery-1.12.4.js"></script>
</head>

<body>
    原生：<input type="text" id="username" onblur="aa()"></input>
    <span id="username1"></span>

    <hr>
    </hr>


    jquery：<input type="text" id="aaa"></input>
    <span id="bbb"></span>
    <script>
        function aa() {
            var a = document.getElementById("username").value
            document.getElementById("username1").innerHTML = a
            alert(a)
        }



        $('#aaa').blur(function () {
            var a = $('#aaa').val()
            $('#bbb').html(a)
            alert(a)
        })

        // 文档就绪函数

        $(document).ready(function () {

            // jQuery functions go here

        });

    </script>
</body>

</html>