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. Scrum中的产品需求预审

    原文作者:Mike Cohn 为了保持产品待办事项(product backlog)的整洁有序,我们须要召开product backlog refinement会议(有时也叫product backl ...

  2. Http post提交和get提交

    public string  PostParameter(string url)         {  string message="";             GetOrde ...

  3. 关于集合类set

    list中允许有重复的元素,而set中不允许有重复的元素. package cn.hncu.Test; import java.util.HashMap; import java.util.Map; ...

  4. Server.MapPath()的用法

    http://blog.csdn.net/qiuhaifeng_csu/article/details/19416407 Server.MapPath(string path)作用是返回与Web服务器 ...

  5. Nim游戏算法实现

  6. [Python] Python's namedtuples can be a great alternative to defining a class manually

    # Why Python is Great: Namedtuples # Using namedtuple is way shorter than # defining a class manuall ...

  7. Java遍历目录下全部文件并替换指定字符串

    应用场景:比方有一个深层次的文件目录结构,如:javaAPI 每一个文件中面都有同样的内容,而我们要统一改动为其它内容.上千个文件假设一个个改动显得太不明智. import java.io.Buffe ...

  8. JXL.jar简单封装Excel读写操作

    1.分析 一个excel文件能够有多页,每页excel中能够有多行,每行中能够有多列.用面向对象的思想能够把一行中的某列看作是一个String对象,一行看作是一个包括多个列的对象.一页是包括多行的对面 ...

  9. 关于XAMPP安装后APACH无法启动的问题

    Xampp的获得和安装都十分简单,你仅仅要到下面网址: http://www.apachefriends.org/zh_cn/xampp.html 下载xampp就可以.我安装的是windows版本号 ...

  10. Hadoop权威指南学习笔记三

    HDFS简单介绍 声明:本文是本人基于Hadoop权威指南学习的一些个人理解和笔记,仅供学习參考.有什么不到之处还望指出,一起学习一起进步. 转载请注明:http://blog.csdn.net/my ...