首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jquery - 页面弹框 - 阻止事件冒泡示例

需求 编写一个简单的页面弹框的示例,功能要求如下: 一个点击按钮,点击可以弹出一个弹框 弹框固定出现在页面的中间位置 需要写一个背景mask,用于遮掩背景,设置透明度0.3 点击弹框外的位置,弹框就可以消失不见...,可以使用fadeOut() 点击弹框内的文本框可以输入内容,弹框不会消失不见 点击弹框右上角的 × 号,则关闭弹框 看完了需求,首先快速写好一波html + css 编写基本html + css ?...好了,这里已经实现了点击显示的操作了,那么下一步要编写点击弹框的其他部分,则弹框隐藏。 编写点击弹框外部,则隐藏 ?...但是,此时点击弹框内也是会让弹框消失的,那如果我要填写弹框的input框来写内容,还没写就消失了,这该怎么办呢?...最后,编写弹框右上角的× 号,点击则隐藏弹框 因为现在点击弹框都不会隐藏,所以可以单独给#close写一个click()方法,设置触发fadeOut()事件。 ?

3.3K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    js页面刷新或关闭时弹框消失_js刷新页面如何保留页面内容

    (e){ e.returnValue=("确定离开当前页面吗?")...; } Jetbrains全家桶1年46,售后保障稳定   用法:onbeforeunload 事件在即将离开当前页面(刷新或关闭)时触发。...该事件可用于弹出对话框,提示用户是继续浏览页面还是离开当前页面。对话框默认的提示信息根据不同的浏览器有所不同,标准的信息类似 “确定要离开此页吗?”。该信息不能删除。...触发于: 关闭浏览器窗口 通过地址栏或收藏夹前往其他页面的时候 点击返回,前进,刷新,主页其中一个的时候 点击 一个前往其他页面的url连接的时候 调用以下任意一个事件的时候:click,document...当用window open打开一个页面,并把本页的window的名字传给要打开的页面的时候。 重新赋予location.href的值的时候。

    11.9K40

    一枚邪恶的输入法浅析

    随着计算机的软硬件不断发展,输入法的功能也不再局限于协助用户完成“输入”的工作,各家输入法为了拉拢用户,绞尽脑汁的为输入法添加了各种各样的小功能,往往能让人眼前一亮。...但试想,如果输入法的附加功能是弹广告呢?近日,360安全中心接到用户的反馈,说自己的浏览器首页被改了,还莫名其妙的弹出好多广告来。...经过我们的一番排查,最终捕获到了这样的一款弹广告的输入法…… 来自色站的你 正所谓“英雄难过美人关”,这仿佛是一个永恒的定律,各种亦真亦假色情网站始终是病毒、木马、流氓推广程序的集中“发货地”。...一个页面中弹窗图片,就像这样: ? 好吧,因为误认为是系统弹窗而用鼠标点击了上面图片的请自觉面壁5秒,谢谢配合。...会触发onclick属性指向的go()函数: function go() { window.location=' 页面直接被定为到了程序的下载页面上

    82160

    Java基础八股文第二弹

    大家好,我是大彬~ 今天给大家分享Java基础高频面试题(第二弹),助力春招! 讲讲深拷贝和浅拷贝? 浅拷贝:拷⻉对象和原始对象的引⽤类型引用同⼀个对象。...Java创建对象有几种方式? Java创建对象有以下几种方式: 用new语句创建对象。 使用反射,使用Class.newInstance()创建对象。 调用对象的clone()方法。...运用反序列化手段,调用java.io.ObjectInputStream对象的readObject()方法。 说说类实例化的顺序 Java中类实例化顺序: 静态属性,静态代码块。...在 Java 中垃圾回收线程就是特殊的守护线程。 Java支持多继承吗? java中,类不支持多继承。接口才支持多继承。接口的作用是拓展对象功能。...Java8的新特性有哪些?

    69710

    深度操作系统20.7正式发布

    兼顾了中国用户和海外用户使用习惯 时间日期新增短日期排列顺序 增加启动器应的右键选中效果 日历 支持通用设置中的选择自动调整日视图和年视图,周一到周日的展示方式 支持日视图鼠标左键选中日期并拖拽,弹出新建日程页面功能...修复打开 smb 服务端,选择发送大文件时传输进度显示异常问题 影院 修复影院播放音频文件默认声音小问题 修复视频文件名称上包含 {} 时,视频无法播放问题 浏览器 修复部分机型浏览器扩展程序安装出错后,弹框点击重试...修复文字识别功能需要截取的图片周围大片的留白,否则会导致文字识别准确度低问题 看图 修复在切换及查看图片时,内存消耗持续升高,产生内存泄露问题 应用商店 修复英文环境下在商店进行应用更新,安装完成后弹框显示中文问题...修复系统语言为西班牙语、波兰语,应用商店最小化时,应用详情页面显示异常问题 控制中心 对输入法快捷键设置页面文案进行修改 修复控制中心搜索不支持对输入法下的三级设置项进行搜索 修复部分机型系统更新时弹出输入法配置框问题...修复在无焦点状态下鼠标右键点击输入法图标,输入法选中错误问题 其它 修复 radeon 显卡终端任务栏花屏问题 修复打开多个窗口连续关闭时窗管崩溃,退出特效模式后无法再次开启问题 修复系统安全漏洞提升系统安全

    80340

    Java并发八股文第二弹

    大家好,我是大彬~ 今天给大家分享Java并发高频面试题(第二弹),助力春招上岸! 文章目录如下: volatile底层原理 synchronized的用法有哪些?...Java编译器会在生成指令系列时在适当的位置会插入内存屏障指令来禁止处理器重排序。插入一个内存屏障,相当于告诉CPU和编译器先于这个命令的必须先执行,后于这个命令的必须后执行。...对一个volatile字段进行写操作,Java内存模型将在写操作后插入一个写屏障指令,这个指令会把之前的写入值都刷新到内存。 synchronized的用法有哪些?...monitor对象存在于每个Java对象的对象头中, synchronized 锁便是通过这种方式获取锁的,也是为什么Java中任意对象可以作为锁的原因 其内部包含一个计数器,当计数器为0则可以成功获取...在 Java 中垃圾回收线程就是特殊的守护线程。 线程间通信方式 volatile volatile 使用共享内存实现线程间相互通信。

    63210

    “吐司”测试二三事

    主要问题 : Toast作为Android轻量级反馈信息提示的系统控件,在目前项目中大量使用,但是由于Toast是系统层面提供的,不依赖于前台页面,存在滥用的风险。...目前为止输入法在测试过程中主要遇到过以下几种情况: 1、多次触发,Toast会按照队列的形式一个接一个的弹出,哪怕此时App退出也会不停的弹; 2、小米机型上触发Toast会带有应用名的前缀提示...; 3、关闭通知权限后,无法正常的反馈给用户提示信息,造成不太友好的体验; 4、在部分机型上,单独的输入法键盘无法弹出Toast,需要悬浮窗权限,但在打开输入法App后,就可以正常弹出了...问题2: 在做定制版项目时,对方测试曾反馈一个问题,在小米手机上,输入法的Toast提示前面总是带着:搜狗输入法 的应用名称,显示如下: ?

    87320

    OpenHarmony 4.1 Release发布啦

    ; 显示/退出交互:所有弹框将要弹出/退出时提供回调,以及对是否允许弹框退出提供回调。...增加异步监听能力,监听系统弹框事件,获取其文本信息并返回。 测试调度框架xDevice 新增单次测试过程中自动复测失败项能力,并支持配置复测次数,最终生成一份测试报告。...稳定性测试工具WuKong 新增page页面和Ability页面的配置能力,支持在测试过程中配置页面屏蔽,提升测试效率。 新增单一场景压测能力,支持针对某一控件循环注入操作事件,并支持配置循环次数。...输入法框架 优化了Webview获焦场景的输入法体验。 优化了窗口焦点切换场景下的输入法体验。 新增支持安全模式输入法。 新增支持Logo键+Space切换输入法。 新增输入法切换列表控件。...新增页面跳转事件上报接口。 支持应用及网络代理、应用证书管理。 支持同层渲染能力(仅限xcomponent、button等部分组件)。 组件支持DOM构建完成后执行提前被注入的JS脚本。

    24710

    java网站页面静态化方案

    1、概述 在大型网站中,如京东和当当商品详情界面,看到的页面基本上是静态页面。为什么都要把页面静态化呢?把页面静态化,好处有很多。例如:访问速度快,更有利于搜索引擎收录等。...目前主流的静态化主要有两种: (1)一种是通过程序将动态页面抓取并保存为静态页面,这样的页面的实际存在于服务器的硬盘中; (2)另外一种是通过WEB服务器的 URL Rewrite的方式,它的原理是通过...2、实时生成静态页面 使用freemarker实现生成静态页面,将页面的实际存在于服务器的硬盘中,然后通过nginx反向代理服务器访问资源; 将动态页面转化为实际存在的静态页面这种方法,由于静态页面的存在...4、将页面分成子数据块 把页面划分成子数据块,每个数据块可能是一个inc文件,也可能多个数据块包含在一个inc文件中。具体的数据块划分根据页面的业务结构来处理。...5、总结 对于一个大型网站来说,生成的页面数据会非常多,管理这些页面文件又是一个问题。例如有的页面被删除了,而已经生成的页面数据还会存在各个web服务器上。

    2.3K40

    21Java网易面经备战版 第三弹

    JWT、可不可以分布式 说一下设计模式 讲一下 https 的秘钥交换过程 内存碎片 二面 自我介绍 介绍项目 讲了实名认证实现 如何确定唯一用户 如何实现脱敏查询教务系统数据(如果教务系统是你的) Java...可不可以分布式 说一下设计模式 讲一下 https 的秘钥交换过程 内存碎片 二面 自我介绍 介绍项目 讲了实名认证实现 如何确定唯一用户 如何实现脱敏查询教务系统数据(如果教务系统是你的) Java...JWT、可不可以分布式 说一下设计模式 讲一下 https 的秘钥交换过程 内存碎片 二面 自我介绍 介绍项目 讲了实名认证实现 如何确定唯一用户 如何实现脱敏查询教务系统数据(如果教务系统是你的) Java

    35820

    Java基础八股文第一弹

    大家好,我是大彬~ 春招来啦,今天给大家分享Java基础高频面试题(第一弹),希望小伙伴们看完之后面试稳过! Java的特点 Java是一门面向对象的编程语言。...Java具有平台独立性和移植性。 Java有一句口号:Write once, run anywhere,一次编写、到处运行。这也是Java的魅力所在。而实现这种特性的正是Java虚拟机JVM。...Java 与 C++ 的区别 Java 是纯粹的面向对象语言,所有的对象都继承自 java.lang.Object,C++ 兼容 C ,不但支持面向对象也支持面向过程。...JDK:Java Development Kit,JAVA语言的软件工具开发包,是整个JAVA开发的核心,它包含了JAVA的运行(JVM+JAVA类库)环境和JAVA工具。...JRE:Java Runtime Environment,Java运行环境,包含JVM标准实现及Java核心类库。

    98710

    java网站页面静态化方案

    1、概述 在大型网站中,如京东和当当商品详情界面,看到的页面基本上是静态页面。为什么都要把页面静态化呢?把页面静态化,好处有很多。例如:访问速度快,更有利于搜索引擎收录等。...目前主流的静态化主要有两种: (1)一种是通过程序将动态页面抓取并保存为静态页面,这样的页面的实际存在于服务器的硬盘中; (2)另外一种是通过WEB服务器的 URL Rewrite的方式,它的原理是通过...2、实时生成静态页面 使用freemarker实现生成静态页面,将页面的实际存在于服务器的硬盘中,然后通过nginx反向代理服务器访问资源; 将动态页面转化为实际存在的静态页面这种方法,由于静态页面的存在...4、将页面分成子数据块 把页面划分成子数据块,每个数据块可能是一个inc文件,也可能多个数据块包含在一个inc文件中。具体的数据块划分根据页面的业务结构来处理。...5、总结 对于一个大型网站来说,生成的页面数据会非常多,管理这些页面文件又是一个问题。例如有的页面被删除了,而已经生成的页面数据还会存在各个web服务器上。

    1.9K30
    领券