button轮番点击，只点击一次，鼠标hover

最新推荐文章于 2023-12-15 18:49:18 发布

weixin_30596023

最新推荐文章于 2023-12-15 18:49:18 发布

阅读量125

点赞数

CC 4.0 BY-SA版权

文章标签： xhtml

原文链接：http://www.cnblogs.com/wyt007/p/6047437.html

本文介绍了一个使用jQuery实现的一次性点击事件示例。通过这种方式，可以确保某个按钮或者元素上的点击事件仅被执行一次，这对于避免重复操作或者多次触发相同功能的情况非常有用。

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

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="scripts/jquery-1.7.1.js"></script>
    <script>
        $(function () {
            ////合成指向、移开事件
            //$('#btnShow').hover(function () {//指向
            //    this.style.color = 'red';
            //}, function () {//移开
            //    this.style.color = 'black';
            //});

            //合成点击事件, 指定在n个函数间切换，点击次数为m
            //$('#btnShow').toggle(function () {//第m%n==1次点击时执行此函数
            //    alert(1);
            //}, function () {//第m%n==2次点击执行此函数
            //    alert(2);
            //}, function () {//第m%n==0次点击执行此函数
            //    alert(3);
            //});

            //合成事件：只将绑定的事件执行一次
            $('#btnShow').one('click', function () {
                alert(1);
            });
        })
    </script>
</head>
<body>
    <input id="btnShow" type="button" value="显示" />
</body>
</html>