jQuery的one()方法用法实例


Posted in Javascript onJanuary 19, 2015

本文实例讲述了jQuery的one()方法用法。分享给大家供大家参考。具体分析如下:

为匹配元素的特定事件绑定一个一次性的事件处理方法。
在语法上one()方法和bind()方法是一样的,它们的不同在于绑定的处理方法的执行次数。

语法结构:

$(selector).one(event,data,function)

参数列表:

参数 描述
type 定义绑定到匹配元素中的事件类型。 如果有多个事件使用空格分隔。
data 可选。传递给事件对象的额外数据对象。
function 定义当事件发生时运行的方法。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>one()函数-三水点靠木</title> 

<style type="text/css">

div{

  width:100px;

  height:100px;

  border:1px solid red

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("div").one("click",function(){

    $(this).append("添加的内容");

  })

})

</script>

</head>

<body>

  <div></div>

</body>

</html>

点击div之后,可以为div添加指定的内容,但是此事件处理函数只会被执行一次。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript中的变量声明早于赋值分析
Mar 01 Javascript
JavaScript动态加载样式表的方法
Mar 21 Javascript
AngularJS 使用$sce控制代码安全检查
Jan 05 Javascript
JS组件系列之Bootstrap table表格组件神器【终结篇】
May 10 Javascript
JavaScript无阻塞加载和defer、async详解
Feb 26 Javascript
ionic2屏幕适配实现适配手机、平板等设备的示例代码
Aug 11 Javascript
使用JS动态显示文本
Sep 09 Javascript
详解react服务端渲染(同构)的方法
Sep 21 Javascript
import与export在node.js中的使用详解
Sep 28 Javascript
Mac中安装nvm的教程分享
Dec 11 Javascript
微信小程序 如何引入外部字体库iconfont的图标
Jan 31 Javascript
Vue使用localStorage存储数据的方法
May 27 Javascript
jQuery学习笔记之jQuery+CSS3的浏览器兼容性
Jan 19 #Javascript
jQuery中bind()方法用法实例
Jan 19 #Javascript
jQuery中on()方法用法实例
Jan 19 #Javascript
jQuery学习笔记之创建DOM元素
Jan 19 #Javascript
jQuery学习笔记之2个小技巧
Jan 19 #Javascript
jQuery浏览器CSS3特写兼容实例
Jan 19 #Javascript
jQuery自定义添加&quot;$&quot;与解决&quot;$&quot;冲突的方法
Jan 19 #Javascript
You might like
星际争霸 Starcraft 编年史
2020/03/14 星际争霸
如何对PHP程序中的常见漏洞进行攻击(下)
2006/10/09 PHP
PHP Trait代码复用类与多继承实现方法详解
2019/06/17 PHP
windows 2008r2+php5.6.28环境搭建详细过程
2019/06/18 PHP
laravel-admin select框默认选中的方法
2019/10/03 PHP
JS子父窗口互相操作取值赋值的方法介绍
2013/05/11 Javascript
ff下JQuery无法监听input的keyup事件的解决方法
2013/12/12 Javascript
JSuggest自动匹配下拉框使用方法(示例代码)
2013/12/27 Javascript
用JS在浏览器中创建下载文件
2014/03/05 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
2014/10/20 Javascript
JavaScript判断DIV内容是否为空的方法
2016/01/29 Javascript
浅谈Vuex@2.3.0 中的 state 支持函数申明
2017/11/22 Javascript
jQuery实现的电子时钟效果完整示例
2018/04/28 jQuery
Node.js 实现远程桌面监控的方法步骤
2019/07/02 Javascript
layui 选择列表,打勾,点击确定返回数据的例子
2019/09/02 Javascript
Python中的sort()方法使用基础教程
2017/01/08 Python
Python实现判断并移除列表指定位置元素的方法
2018/04/13 Python
浅谈django rest jwt vue 跨域问题
2018/10/26 Python
基于Python实现扑克牌面试题
2019/12/11 Python
Python实现手机号自动判断男女性别(实例解析)
2019/12/22 Python
浅谈PyTorch的可重复性问题(如何使实验结果可复现)
2020/02/20 Python
html5拖曳操作 HTML5实现网页元素的拖放操作
2013/01/02 HTML / CSS
英国图书音像网站:Hive.co.uk(图书、电子书、DVD、蓝光、音乐CD等)
2017/10/16 全球购物
时尚设计师手表:The Watch Cabin
2018/10/06 全球购物
澳大利亚家用电器在线商店:Billy Guyatts
2020/05/05 全球购物
员工自我鉴定
2013/10/09 职场文书
迟到检讨书300字
2014/02/14 职场文书
舞蹈兴趣小组活动总结
2014/07/07 职场文书
工会趣味活动方案
2014/08/18 职场文书
三严三实心得体会范文
2014/10/13 职场文书
2014年作风建设工作总结
2014/10/29 职场文书
2015小学五年级班主任工作总结
2015/05/21 职场文书
检讨书怎么写?
2019/06/21 职场文书
深入理解Vue的数据响应式
2021/05/15 Vue.js
纯html+css实现打字效果
2021/08/02 HTML / CSS
Python中time与datetime模块使用方法详解
2022/03/31 Python