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">&times;</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 元素关闭按钮的交互功能的更多相关文章

  1. JS DOM 来控制HTML元素

    JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...

  2. JS DOM对象控制HTML元素详解

    JS DOM对象控制HTML元素详解 方法: getElementsByName()  获取name getElementsByTagName()  获取元素 getAttribute()  获取元素 ...

  3. js/jq 动态添加的元素不能触发绑定事件解决方案

    <!-- Copyright 2017-10-27, Jachin QQ: 381558301 Email: 381558301@qq.com 请看看你们的版本并对号入座: jquery1.6版 ...

  4. amazeui学习笔记--js插件(UI增强2)--按钮交互Button

    amazeui学习笔记--js插件(UI增强2)--按钮交互Button 一.总结 1.按钮loading状态: <button type="button" class=&q ...

  5. 【笔记】js获取当前点击元素的索引

    以前用jq 做过图片切换 滑动之类的特效现在想用js 试试是怎么一回事 jq图片切换的思路是用index()函数获取当前点击的按钮的索引然后根据索引值将对应索引的图片显示出来 于是查了一下js 是如何 ...

  6. Ext JS中Button的一般使用

    Ext JS中Button按钮的显示,以及按钮的部分事件 一.属性 renderTo:将当前对象所生成的HTML对象存放在指定的对象中 text:得到按钮名称 minWidth:按钮最小宽度 hidd ...

  7. JS代码中加上alert才能正常显示效果

    模拟一个生成验证码的效果,发现JS代码中加上alert可以正常刷新,没有alert时图片就会丢失,找到解决方法,但是还不是很明白,先记录下来. 生成验证码的servlet代码如下: package s ...

  8. js中如何删除某个元素下面的所有子元素?(两种方法)

    js中如何删除某个元素下面的所有子元素?(两种方法) 一.总结 方法一:通过元素的innerHTML属性 元素element.innerHTML=""; 方法二:通过元素的remo ...

  9. js与jquery获取父元素,删除子元素的不同方法

    var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...

随机推荐

  1. 第二天,导出文件sql,查询,视图view,聚合函数,反模式,字符串处理函数

    //把数据库导出到脚本文件mysqldump -uroot -p1234 --databases abc > d:/a/abc.sql CREATE TABLE stud( id INT PRI ...

  2. jquery07

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  3. Jmeter作为工具的性能测

    [原创]相对完整的一套以Jmeter作为工具的性能测试教程(接口性能测试,数据库性能测试以及服务器端性能监测) 准备工作 jmeter3.1,为什么是3.1,因为它是要配合使用的serveragent ...

  4. Netty系列之Netty编解码框架分析

    1. 背景 1.1. 编解码技术 通常我们也习惯将编码(Encode)称为序列化(serialization),它将对象序列化为字节数组,用于网络传输.数据持久化或者其它用途. 反之,解码(Decod ...

  5. JavaScript--数据结构与算法之集合

    集合(Set):是一种包含不同元素的数据结构. 重要特性:1.集合中的成员时无序的:2.集合中不允许相同的成员存在. 使用场景:用于存储一些独一无二的元素. 1 集合的定义:(和高中数学中的集合一样) ...

  6. RecyclerView下拉刷新和载入很多其它

    之前一直写的是ListVIew下拉刷新,可是好多朋友都说要RecycleView的下拉刷新和滑动载入.事实上,这个原理都是几乎相同.抽出时间,我就写了下RecycleView的下拉刷新和滑动载入很多其 ...

  7. AngularJS渲染性能分析

    作者:Jiang, Jilin AngularJS中,通过数据绑定.能够十分方便的构建页面.可是当面对复杂的循环嵌套结构时,渲染会遇到性能瓶颈.今天,我们将通过一些列实验,来測试AngularJS的渲 ...

  8. resource-color 的引用

    1.在xml文件中引用 android:textColor="@color/tv_top_title_color" 2.在代码中引用 1)在color.xml中定义 <?xm ...

  9. 20.Node.js EventEmitter的方法和事件

    转自:http://www.runoob.com/nodejs/nodejs-tutorial.html EventEmitter 提供了多个属性,如 on 和 emit.on 函数用于绑定事件函数, ...

  10. C#截取指定长度中英文字符串方法 (修改)

    public static string GetFirstString(string stringToSub, int length) { Regex regex = new Regex(" ...