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. windows下搭建hadoop-2.6.0本地idea开发环境

    概述 本文记录windows下hadoop本地开发环境的搭建: OS:windows hadoop执行模式:独立模式 安装包结构: Hadoop-2.6.0-Windows.zip - cygwinI ...

  2. spark资料下载

    很全的spark资料下载,包含pdf书籍和培训学校视频教程, 1.spark多语言编程:spark多语言开发 2.tachyon:tachyon 3.sparkR:sparkR 所有内容请点击:所有内 ...

  3. WPF 布局控件 之 DockPanel

    DockPanel为容器控件 主要了解其Dock属性和LastChildFill属性的使用 一.LastChildFill="True" 时 代码: <DockPanel L ...

  4. region实现大纲效果

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  5. windows 常见环境变量(%AppData%、%TEMP%、%TMP%)

    set 命令查看全部环境变量: %AppData%(应用程序数据).%TEMP%(临时文件夹).%TMP%(临时文件夹) .%LocalAppData%(应用程序本地数据)三个环境变量: C:\Use ...

  6. 4. Brackets 前端编辑器试用

    转自:https://blog.csdn.net/wuji3390/article/details/71170579 Brackets编辑器介绍 "一个现代的,开源的,了解网页设计的编辑器& ...

  7. SQL insert 主键冲突

    待总结 https://blog.csdn.net/JavaCoder_juejue/article/details/82313891 https://blog.csdn.net/a772304419 ...

  8. 洛谷 P1850 换教室

    P1850 换教室 题目描述 对于刚上大学的牛牛来说,他面临的第一个问题是如何根据实际情况申请合适的课程. 在可以选择的课程中,有 2n2n 节课程安排在 nn 个时间段上.在第 ii(1 \leq ...

  9. 35.Node.js GET/POST请求

    转自:http://www.runoob.com/nodejs/nodejs-module-system.html 在很多场景中,我们的服务器都需要跟用户的浏览器打交道,如表单提交. 表单提交到服务器 ...

  10. 动态链接库DLL的创建生成及调用

    一.背景 最近在做CANTOUSB底层驱动的调用,是调用别人已经封装好的库,看不到别人写的源程序.程序中调用的是隐式调用即 x.h+x.lib+x.dll,其中DLL即是动态链接库(Dynamic L ...