午小白感觉有些感冒,身上特别沉,虽然一点状态都没有,但想起上午自定义弹窗的关闭事件还没有做,心里一直放不下,还是找到了老朱:“朱哥,有时间没?咱聊聊弹窗关闭的事情吧!”
老朱也有点感冒,哑着嗓子跟小白说:“我看你今天的状态也不好,今天只把窗口关闭的方法实现了吧!你现在对JavaScript的机制还不是特别熟练,我们也不要做的太深入了,尽量用之前接触过的方法来实现。你打开上午的代码我们对着代码说吧!”
“我们现在把你做的功能屡一遍看看,首先你设置的Layer对象有两个属性:弹窗标题(title)和弹窗内容(content),通过alert方法传递一个含有title值和content值的对象后,先更改弹窗的标题和内容属性字段,然后将弹窗的html内容写入到body的底部。”
小白说道:“是的,我刚才想过一个关闭窗口的办法:在确定按钮上面添加一个onclick事件。测试了一下也可以关闭窗口,是不是这样就可以了?”
“你设置的确定按钮“点击事件”仅仅是从页面中找到弹窗容器后把它移除掉,假如我还想点了确定按钮以后,再做一些其他的处理就不好办了。具体来说就是弹窗出现以后我们给Layer窗口传递一个函数,当点击确定以后不但窗口关闭,还得执行我们传递的那个函数。”
“函数也能作为参数传递么?”,小白不解的问道。
“当然可以了,函数不但能作为参数传递,还能把多个函数放到数组里面,这个我们以后再详细讨论。你现在给layer传递的参数是一个对象,既然是对象肯定能添加方法,传递的那个函数就放到这个对象的方法里。”
“有点晕啊!”
“我把你之前页面中使用Layer.alert()方法传递的参数改一下你就明白了。”
“看到没?之前我们的参数对象只包含title和content。现在增加了一个onsure,它的值就是一个让页面中的图片隐藏的函数!现在我把Layer的alert方法改一下,你看看。”
“在alert方法中我们使用确定按钮的click事件,把传递进来的函数和隐藏窗口的方法都执行就可以了。现在看一下页面中的弹窗功能能不能实现点击确定以后隐藏图片!”
老朱最后说道:“小白,你觉得现在的弹窗还有什么问题么?”
“我觉的挺不错了!难道还有什么需要设置的么?”
“还有很多,现在的这个弹窗在特别小的项目上可以使用,一旦碰到比较大的项目肯定就不适合了,因为现在很多HTML5页面都是使用首页加载卸载功能模块的方式,有时会碰到多个弹窗的问题,也可能碰到更复杂的问题,因为你现在还没有接触过,所以现在这个弹窗功能实现上也不用做太多的完善,完了有时间把弹窗的样式和动画效果做出来就可以了!”
“通过做这个弹窗控件,你应该对JavaScript有了重新认识了,你练习的时候重点思考一下JavaScript对象属性和方法之间的关系、对象作为参数传递、以及jQuery对象使用的append和remove方法。”
想学HTML5的朋友可以关注老炉,您的关注是我持续更新《小白HTML5成长之路》的动力!
个判断页面是否真的关闭和刷新的方法
们在搜索资料的时候会看到一些非常有用的资料,但往往这些资料都是付费资料。只能看一部分,不能直接复制下来。如果要直接下载,那只能付费下载。今天就教大家一个方法,可以免费复制付费文档资料。一分钟学会,看懂能让你少花很多钱。这个小技巧建议大家收藏,以免找不到。下面大家跟着我一步步做吧!
如何免费复制付费文档资料
首先我们打开某度文档,在里面搜索到了一篇文章,文档显示需要VIP专享才可以下载。在这里如果我们直接复制这里的文字,就是弹出一个对话框,显示文档复制为VIP权益,开通VIP可继续复制。
弹出的vip窗口
重点来了,我们在页面的空白处点击右键,并打开检查选项。这检查功能太重要了,里面我们可以看到该网页的源代码。这个一般是前端开发人员经常用到的功能,不仅可以调试各种样式参数,还可以看数据传递性能。
检查选项
我们找到设置按钮(如下图的红色圈标注的地方),对页面的首选项(preferences)进行设置。
设置按钮
下拉找到调试程序(Debugger)选项,将禁用Javascript(Disable Javascript)进行勾选。
勾选禁止JavaScript按钮
不要关闭检查窗口,我们发现原来我们打开的页面文章选中后已经可以复制了。大功告成。是不是很简单。大家学会了吗?
大功告成
这个免费复制的原理就是禁用网页的页面Javascript代码。缺点也是非常明显,就是不能直接复制图片或者特殊文字代码等。所以,如果大家需要完整的文档最好还是付费购买吧。
1.如果用这个办法不能复制,可能就是原来资料本身就是不可编辑的资料,比如别人就是以图片形式上传的资料。
2.尊重别人的劳动成果,不可将别人的资料直接应用到自己的作品中。只可用于个人学习之用。
3.由于平台打击各种第三方工具下载,以前的很多工具(网站)已经失效,如果有购买的需谨慎。
注:我是秦韵莞香,和你聊聊日常的数码科技、互联网趣闻,每天一更,欢迎关注。原创文章,未经授权不得转载,侵权必究。
*请认真填写需求信息,我们会在24小时内与您取得联系。