js用button激活 Alert 元素关闭按钮的交互功能
js用button激活 Alert 元素关闭按钮的交互功能
一、总结
1、点(.)对应class,井号(#)对应id
2、jquery:amaze里面用的jquery,jquery熟悉之后,这些东西就很简单了,jquery很简单,一层一层的$().__()
二、js用button激活 Alert 元素关闭按钮的交互功能
样例

代码:
<div class="am-alert" id="your-alert">
<button type="button" class="am-close">×</button>
<p>在应用 JS 激活之前这个警告框是无法关闭的。不信点右边的 x 试试。</p>
</div>
<button type="button" class="am-btn am-btn-danger" id="doc-alert-btn-bind">点击激活上面 Alert 的关闭功能</button>
<script>
$(function() {
$('#doc-alert-btn-bind').one('click', function() {
$('#your-alert').alert();
alert('已激活,点击上的 X 试试!');
});
});
</script>
1、点(.)对应class,井号(#)对应id
2、第9行,添加alert()事件后,警告框才有效
3、函数模式:$(function(){}),就是整个都被一个$()包进去了
4、选择器添加事件方法:通过id或者类名直接添加事件,而不是在什么onclick里面添加js函数
5、jquery的one()方法:第八行的 one 是jquery里面的one()方法,意思是 向匹配元素添加事件处理器。每个元素只能触发一次该处理器。
js用button激活 Alert 元素关闭按钮的交互功能的更多相关文章
- JS DOM 来控制HTML元素
JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- JS DOM对象控制HTML元素详解
JS DOM对象控制HTML元素详解 方法: getElementsByName() 获取name getElementsByTagName() 获取元素 getAttribute() 获取元素 ...
- js/jq 动态添加的元素不能触发绑定事件解决方案
<!-- Copyright 2017-10-27, Jachin QQ: 381558301 Email: 381558301@qq.com 请看看你们的版本并对号入座: jquery1.6版 ...
- amazeui学习笔记--js插件(UI增强2)--按钮交互Button
amazeui学习笔记--js插件(UI增强2)--按钮交互Button 一.总结 1.按钮loading状态: <button type="button" class=&q ...
- 【笔记】js获取当前点击元素的索引
以前用jq 做过图片切换 滑动之类的特效现在想用js 试试是怎么一回事 jq图片切换的思路是用index()函数获取当前点击的按钮的索引然后根据索引值将对应索引的图片显示出来 于是查了一下js 是如何 ...
- Ext JS中Button的一般使用
Ext JS中Button按钮的显示,以及按钮的部分事件 一.属性 renderTo:将当前对象所生成的HTML对象存放在指定的对象中 text:得到按钮名称 minWidth:按钮最小宽度 hidd ...
- JS代码中加上alert才能正常显示效果
模拟一个生成验证码的效果,发现JS代码中加上alert可以正常刷新,没有alert时图片就会丢失,找到解决方法,但是还不是很明白,先记录下来. 生成验证码的servlet代码如下: package s ...
- js中如何删除某个元素下面的所有子元素?(两种方法)
js中如何删除某个元素下面的所有子元素?(两种方法) 一.总结 方法一:通过元素的innerHTML属性 元素element.innerHTML=""; 方法二:通过元素的remo ...
- js与jquery获取父元素,删除子元素的不同方法
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...
随机推荐
- Swift Standard Library Reference.pdf
Swift Standard Library Reference.pdf 下载地址 http://download.csdn.net/detail/swifttrain/7446331 自己的Mark ...
- 41.Node.js使用cnpm
转自:http://www.runoob.com/nodejs/nodejs-tutorial.html npm是Node.js中维护第三方库.模块的工具,但是国外的速度很悲剧,这里有一个中国的源cn ...
- 玩转redux--从会用到庖丁解牛
目录 为何而写 redux是什么 redux的设计哲学 redux的工作流 redux的几个核心要素 store action reducer actionCreator combineReducer ...
- 关于vue.js中v-model与表单控件的双向绑定。
单选框:<input type="checkbox" id="checkbox" v-model="checked"><l ...
- LuoguP3254 圆桌问题(最大流)
题目描述 假设有来自m 个不同单位的代表参加一次国际会议.每个单位的代表数分别为ri (i =1,2,……,m). 会议餐厅共有n 张餐桌,每张餐桌可容纳ci (i =1,2,……,n)个代表就餐. ...
- spring boot 热启动
spring boot热启动有两种方式 1. 以Maven插件的形式去加载,所以启动时使用通过Maven命令mvn spring-boot:run启动,而通过Application.run方式启动的会 ...
- Springboot2.0访问Redis集群
Redis 是一个开源(BSD许可)的,内存中的数据结构存储系统,它可以用作高性能的key-value数据库.缓存和消息中间件,掌握它是程序员的必备技能,下面是一个springboot访问redis的 ...
- [ReasonML] Named & optional params
// ::country is named param // ::country=?: which make it optional // because we make ::country=? op ...
- Hadoop作业性能指标及參数调优实例 (二)Hadoop作业性能调优7个建议
作者:Shu, Alison Hadoop作业性能调优的两种场景: 一.用户观察到作业性能差,主动寻求帮助. (一)eBayEagle作业性能分析器 1. Hadoop作业性能异常指标 2. Hado ...
- Rsync 指令的使用方法
RsyncLinux版下载:http://rsync.samba.org/download.htmlWindows版下载:https://www.itefix.no/i2/cwrsync-get 选( ...