00:00
开始。嗯,好,刚刚我们是不是说了一下这个移动端一些基本的事件啊,好,那我们继续好再来看。呃,对于这个阻止世界默认行为这个东西,到底能不能理解啊?比如说这是我们最外面最最顶层的吧,OK,我们里面有好几层。是不是好,我们说冒泡,冒泡是不是往哪冒,往上冒吗?是不是在这个冒泡的过程当中,他会去看你每一个负极有没有阻止世界人不人新闻,只要有一个阻止了,那他就阻止。懂不懂他就会往上看嘛,首先你点它肯定得有时间的默认行为吧,是不是,至于这个事件的默认行为到底能不能触发,干嘛冒泡完了之后才知道。一层层往上走吗?看他老爸有没有柱子,看他爷爷有没有竹子,看他最最外面这一层有没有柱子,如果有一层是竹子的。
01:01
他就住止。懂不懂,OK,那一旦我在这边干嘛。嗯,一旦这边比如说我让你冒冒冒是不是,比如说你冒到这一层的时候,我让你阻止冒泡,就是你冒泡只冒到这一层嘛。如果这两层都没有柱子之间的关系干嘛?他就有默认行为吗?是不是如果这一层组织默认行为会对他们有任何的影响吗?不会啊,你在这边干嘛,现在干嘛隔断了。上不去了,不去看它了,能不能理解,所以说我们怎么去全面静止时间的问题们不就是在你的最顶层干嘛?先把世界的模型为全部给你定了嘛,反正你子元素最终冒泡肯定会冒上来的。正常情况下是不是肯定会冒上来了,除非你当时干嘛自己来了一刀,你这来了一刀肯定是人为的去触发的嘛。这系统不会干嘛,默认给你去拦一刀吧,能不能理讲啊啊那记住啊,那这样吧,我们给给大家去制定一个更丑的一点菜单。
02:10
啊,自定义邮件来的,怎么做?想想就在我们的PC端。首先你要禁止啊,不是你要自定义右键菜单,你是不是得把右键菜单先给禁止掉。那怎么办?多点on什么content menu给你first,那不就禁止掉了吗?是不是啊,好,我们来看,那这样的话,我打开来肯定是。来看一下,那这样我一旦打开来,每次我右击的时候,肯定是没有右键菜单嘛,那我制定一个更丑的,我就让这个外做成我们那个右键菜单来看,我来一个200PSCTRL是吧。
03:00
是不是在这,这就是我们以后的优点在哪,你里面自己能不能写一个列表,写点链接去跳转都可以啊,是不是啊,咋整啊,首先上来,第四问什么。为闹吗?看不到吗?是不是每次右击的时候让他跟着我的鼠标跑吗?不就行了吗?那怎么办?怎么办?你不是有个EV吗?是不是为什么EV等于等于E,或者一是不是Y一个X等于什么e.XY一个。Y等于E点,可Y这不相当于是口的吗?是吧?那怎么办?找到这个呗,挖一个外号等于什么?
04:01
Document点找到这个什么外嘛,是吧,那干嘛,那你这个外点什么掉点什么,你这边是不是应该有一个play行为对吧。为什么是不是然后呢,外点left等于点top。Y加PX吗?是不是这样的,而且它得显示出来吧,这个直方Y和点点。Display等于什么block看一下嘛,CTRLS点你点你点你点这不就出来了,是不是右是不是一个右键菜单左击的时候它干嘛消失呗,干嘛主机什么我克呗。
05:05
等于一个去消失掉。点点display等于,那那是不是自定义的右键就出来了。感觉是一些,你看。点掉点掉是不是,你看你们QQ是不是QQ空间是不是有什么皮肤什么的特别好看啊,一点的时候这个皮肤是不是不一样的啊,差不多知道应该怎么做了吧,你搞个背景图你还不会。是不是啊,搞个背景图,搞成自己的都行。能不理讲啊,你要是会,你要是有兴趣做这个事情的话,你这个啊,还还说找不到女朋友是不是OK,好好,那自定义右键上单是不是OK,好,那我们继续往下啊,这个是一个小插曲啊,给你们稍微写一写啊,以后写东西的话,思路稍微广一点,好,我们再来啊,继续往下走,好看我这边还要讲什么。
06:16
好事件基础当中。我们是不是应。讲到了这个橡皮效果了,怎么去禁止它?再来说一个隐患。好什么隐患,CTRLCCTRLB啊,这个隐患很让人头疼。好,再来看现在我的写法啊,不应该是这个,应该什么全面镜止这个吧,Ctrl a ctrl c贴过来。CTRLCTRLCTRLS保存干掉。好,现在是不是禁止系统默认行为,是不是以后写移动端几样东西是必须要写的?
07:00
好,我们来理理移动端的一个模板,第一个是什么,没标签,第二个呢。阻止什么事件的全面阻止事件的默认行为,第三个呢?一个视频方案是不是,嗯,把这个按压视频方案我们再来写一遍啊,这是最后一次带你们去手写,以后都贴了。好回忆,回忆咋想?先来两个大括号,再再说是吧,万什么告诉我什么no等于什么回创建一个标签,然后呢,OK,那思应该是这样的,最终干嘛塞到还里面去的,掉漏的是不是只是说这个style弄得比较特殊。
08:20
怎么特殊了,他里面有东西点音呢,HT控制什么HT的方,他size是不是肯定是一个PX值,而且我们说这个东西的权重要最高m po啊TT是不是好,至于这个值是多少。需要我们自己去啊计算是吧,怎么计算。一个什么W等于什么点多点除以16。
09:05
是不是OK,当然你可以定一个变量是不是以后这个变量是不是就可以改了。能不能理解,OK,好,完事,好,那我们继续啊,你们其实看到的最长的写法可能是这样的啊,这边肯定有一个flag。是不是OK,可能是这样写的。是不是一样的一样的吧,只不过咱们把这个东西给写死嘛,我也建一个吗?写死掉了懂吗?OK,好,可是这个跑不起来,会报错。是不是?为什么不错,两个大括号扣到一起了。懂不懂说每次写L f1之前,自己加一个分号在他前面。啊,编码规范懂不懂啊,每次写I fe之前,这叫I fe嘛,函数字调用嘛,每次写这种函数自调之前,在它前面加个分号或者加感叹号也行,他就不会报错。
10:08
就不会报错,有没讲?好,这这个很正常啊,就不想让你这两个括号干嘛放到一块去啊,这两括号一旦合到一块,自己看是不函数调用了吗?你看这两个括号放到一块就不正常,你要知这两个括号放到一起在里面干嘛。在GS里面,就是函数调用的时候才会这样。等等,不然你不可能看到两个括号什么靠在一起的吧,让他两个隔开来分号,一般这个分号我们写在F1的前面啊,你不喜欢写分号的,写看好都行,能理解吗?OK,这叫编码规范啊,自己注意一下好,那我们是不是得说一个隐患,那到底什么隐患呢?来看一下,现在我们是不是已经用了这个全面阻止司机的默认行为了,好,它是有一个隐患的。
11:01
好,这个隐患还比较好玩,来看一下现在我是不是有一个item嘛,是不是啊好,照理来讲,大家看这个文字是不是已经超过我整个区域了,OK,让想让这个粉红色块出现滚条怎么办哦,为什么大看有没有出现滚头条。是不是有的,可是一旦你干嘛,诶,这是不是不是出现滚动条了,来看我的真机不应该出现滚动条。来看下成绩。好,我来扫一扫。啊,以后我们讲了构,讲了那个构建工具之后啊,这个东西就比较好测了啊,现在因为没有讲构建工具,所以说我每次都得自己来扫啊,而且我这手机屏幕给我摔的已经。
12:09
啊,摸上去都疼的那种。这个怎么关?好,重新走。好,再来看。好,你看有没有出现滚动条,没有吧,看我们里面有没有出现滚条,是不是有,你看我们这里面有没有没有懂不懂,OK,什么意思,只要你阻止了这个事件的默认行为,你是不是全面禁止,全面禁止事件的认行为的页面上所理的事效。页面上所有的功能失效。可是我问你。
13:04
APP里面你能看到页面元素当中有滚动条的几率大不大?不到。可是有一个地方是肯定有滚动条的。最外层,最外层肯定肯定是有那个滚动条是吧,那个滚动条也被记走掉了。懂吗?那所以才会有一个需求,自定义更牛逼的滚动条,记住,移动端开发基本上不用系统滚动条,除非你这个项目极其简单,我们可以来看一看。基本上移动端的滚动条都是比较。有逻辑的,比如说京东。Abshoop。刷一下。哎,走你了。什么鬼?
14:01
OK,大家看移动端的滚动条是不是很短啊?是不是我问大家这个滚动条上有没有一些动画?有没有,慢慢会消失吧,而且你在移动端玩滚动条的时候,有可能是拉着滚动条去滑页面吗?你找得到滚动条吗?只是说定位,你现在划到哪了,懂不懂,像这种滚动条,最终我们会拿一个延来模拟。也就是说系统的滚动条我会给他。禁掉的懂吗?一般都会禁掉,因为你讲好这个以后,我们自己以后我们写业务逻辑的时候,我们再来再来说啊OK。好,要知道这个隐患,好,那讲完这个东西之后,讲了一个隐患吧,好,最终讲一个厉害的事件。点头,好,来看什么是时间点投。CTRLCCTRLB,好,这个东西经常被问到。事件点头,好,我来写一个小DEMO,好干掉CTRL。
15:09
干掉啊,这是我们移动的套路吧?套路咱先不要把干掉,好我们我们单独来看时间点头,比如说我现在是不是有个item,好这个item的话背景是不是P卡。我让这个B变,我让这个元素变得稍微透明一点吧,我这点变成原来的点五来看一下。你看是不是这样的,F12过来刷一下,这没有,这没有任何问题吧,我让他底下来一个A标签。啊,这个干嘛。跳转HTTP回娘家吧3W点什么艾特硅谷点com是不是啊回娘家。OK啊,以后硅谷就是你们娘家来刷一下,走点来看好我干嘛,现在我在点的话肯定干嘛。
16:04
但没发现。居然。跳了。没有柱子也不开窍,我上面有一层div的。哦哦哦,他是不是写到这个里面去了,这个跳正常吗?你是他的一个子元素吗?是不是,那我就点了这个A标签吗?这个跳正常吗?吓我一跳。来看一下这你这两个如果是并列的。啊,并列的看是不是这样的,好,我让他定位定起来。行为,那不是吧,Left为零干嘛,Top为零,你那A标签是不是又下去了,这时候点一下不会跳的吧。这不会跳吧,为什么我是点点在了D上啊,我没有点一标签啊,是不是啊好,现在来看我,如果我说我要写个小东西,比如说干嘛。
17:11
嗯,一个it等于。多的点。是吧,我来找到这个艾来看一下,好,我说每次我点这个it的时候啊。爱点哦。他每次他切时候上来干嘛,我让你这个小玩意自己。隐藏掉可不可以啊,那我能不用this this点点。Display。No。不是的,鞋多了,OK,刷一下,看着刚刚我在点的时候,如果没有这个脚本的话,会不会跳转。
18:03
不会吧,好,看着我还是点一次,我不点两次,看着我点一次变变没了,好说一下,我在这个部位点点一次。哦,我发誓,我只点了一次。看到我发誓,我指点一下。这个怎么把韩顺平点出来了,OK啊。刷一下刷一下,你看我点一次吧,好之后你看我在这边点一次啊,居然跳转了,应不应该跳转。不应该,因为我点一次只是让你干嘛,让这个item啊,是不是啊,你居然干嘛。你居然是不是干嘛跳转了,这是不是一个点透啊。我让这个城消失,最终居然触发了这个A标签的跳转。你说这个叫事情吗?哎,如果用click看一下走,你我刷一下还在这边点跳没跳,好像在移动端应该使用时间。
19:06
是不是啊?问你可个世界能不能在移动端出发,可以你会发现很多人写项目就好,可是告诉你好为什么有这种问题,我们要解决这种问题,告诉你移动端不可能用,可一个时间去开发的,肯定得用他是道,可是用他上是有问题的。好首先得有一个点大家得确定。PC端的事件。PC端的事件。可以在移动端触发第二个点,PC端事件。有300毫秒延迟,第三点移动端时间不会有延迟,好来我们再来分析我们刚刚那个套路,停,首先这三点知道一下,好,我们来看一下。
20:12
好比如说现在我是不是肯定一个事件,PC端事件吗。为什么PC端时间要有300毫米延迟,大家我点下去的那一刹那,有没有触发OK这个事件?啊,其实没有,我点下去那一刹那,什么时候能触发事件。你点下去的时候,跟你抬起来的时候,如果是在同一个像数点上,那就触发这个事件。懂吗?你点下去的时候其实在触发home down事件。能不理解,只是说你点下去抬起来的时候,如果是在同一个像素点上,那就是出发功克时间。能不理解啊,这个自己稍微知道一下啊,这是题外话,好,那为什么看到我们刚才那种效果了,我问你。
21:00
首先问大家,我点上去这一刹那触发了几个事件。On click。Almost touch。On w,这些事件是不是都在这边准备准准备出发呢,是不是?那么你在我点下来抬起的一瞬间?就我点下去抬起来,肯定触发了一个欧斯大事件,触发了一个欧事件。而且还触发了一个OK的一个事件,是不是那问你。那怎么样才算触发一个on click?双击吗?我浏览器怎么知道你到底这个时候触发的是o click还是click。他要不要等300毫秒去看一下,你有没有点第二次啊,如果点第二次就给你出发达吗?不会触发吗。所以说因为平行段事件太多了吧。我浏览器得确认什么,你到底触发的是哪一类事件,所以给我300毫秒,让我想一想。
22:07
懂不懂?可是移动端事件少啊。On touch touch touch摁的嘛,你点下去干嘛,百分百是on touch。是大码,不可能有其他时间的。能理解吗?好,所以说PC端在移动端出发的时候会有,PC端的事件在移动端出发的时候都会有,基本上都会有300毫秒的延迟,人们讲那你想一想。现在我点上去的一刹那。触发了克事件,也触发了他大事件吧,可是我是不是只给克事件把把它毁掉,也就只有克克才有回调,可以执行吗?是不是奥克利克回调问你这个层?这个粉红色,这个橙是在什么时候消失的?是点下去就消失了,还是说等着300毫秒才消失的?等着吧。
23:00
能不能讲是不是等了300毫秒之后,这个层消失了,你如果用它知道好问你上去这个城什么时候消失的,上去就消失了,300毫秒之后有没有在原地方,就在这个点击的位置再去出发个事。有没有?有没有上来,我问你点的第一下有没有触发塔斯大世家。嗯,他知道时间有没有回调。让这个层变没了,是不是300毫秒之后肯定渲染完了,300毫秒对于浏览器来说实在是太奢侈了,是不是300毫秒之后在原处你点击这个位置有没有触发事件。触发的时候这边有没有A标签。点上去要不要跳世界没点透点透了。没讲,如果你绑定的是一个可的话,我问你你上来有没有触发他其他时点有,只不过有没有回调,没有300毫速度出发。
24:11
肯定是讲把这个display变成now。是不是啊,那300毫秒之后才把这个这造成变震到了吧,那你想想还会点点到这一标签吧。点不到了吧。能不能理解啊,OK,那这是移动端最最经典的一个问题,就是事件点透能不能理解,事件点透的根本原因是什么?PC端的事件在移动端有300毫秒的延迟,其实不光在移动端,就在P端去执行,去执行个时间时候有没有延迟。有的。只不过这个300毫秒对于PK来说的话,干嘛根本就不算事情,对于我们来说的话,你这300毫秒你干嘛,你看都看不到,是不是给你三秒,你打出的都都不一定能看到,就不要说300毫秒了。
25:02
能不能理解啊,OK,好,那我问你。这种A标签你还能还能让他自己挑吗?看见吗?风险太大是不是?OK,大家看,那一旦我问你,一旦我把所有的时间的默行为全部禁掉,你这一标线还能跳吗?那么移动端跳转方案。比如说都是A标签。干掉都是一标签是不是啊?好,我来写一段脚本上来干嘛?这个艾特都可以不用要了,他也干吗?不用了,就把我们什么。这个东西一写CTRLC,我问你A标签还能不能跳,能吗?上哪跳跳哪跳是吧,可是在这个模拟器里面能不能跳。
26:02
模拟前面能跳,因为没有。没有什么阻止掉啊,他他没用啊,相当于我没有写啊,可是在移动的这样器呢,能不能把它给阻止掉,肯定能阻止掉的,要不要撤下。要撤好,那撤吧,我还以为不用撤了,我想客气一下,没想到你们这么走,OK啊。192.168.17.39是不是OK,主要这个车太烦了知道。每次我都要开开我的手机,每次摸我的屏幕,我手都疼。好,来看我看我点。看到我在点吗?跳了吗?跳行为没了吧,因为你干嘛禁止掉了。
27:06
懂不懂?OK,那想想,那现在A标是不是不能挑了?A标签不能跳,你能不能接受啊,肯定不能接受啊,是不是我经常要要跳转的呀,你A标签都不能跳了你。那我干嘛,那我咋开发,那我是不是得有自己的调整方案,OK,那怎么办?我找到页面上说的标签,等于点Q加哦,我找到所有的表情。找到这些标签干嘛,我循环你自己不跳,我让你跳是不是啊,你自己不是被被禁了吗?是不是啊,OK,你被禁你就禁了呗。那我自己让你,我干嘛主动告诉你待会去跳行不行啊。I小于什么?
28:02
在家吗,怎么办?爱的什么时候应该跳,他知道还是他的。摁的吧,你不是到时候去跳吧,你手指抬起来才才应该去掉吧,是吧,OK,干嘛让你去跳转吗。是吧,怎么跳转跳转,除了这种哈佛你还能怎么跳?你还能怎么跳?还能怎么调?身上有没有叫做一个汉堡?点嘛,等于什么this点。HREF码。没见过啊,我的个天哪。
29:10
没见过也没关系啊,网上一查就知道了。C吧,Location是我们BOO里面的一个东西吧,Window身上的吧window吧,看location身上只有方法,不应该OK。哇,这个是找的大写的六颗星。好上有有没有叫做哈佛。OPQRSTABCDEFGHIHI。诶。没有吧,啊,这是window。哎,我找怎么找到哪个接口window location。是吧,好像没有哈吧,看他有没有继承什么的。
30:00
哦哦,大没看到电可是一个指读对象吗?你可以付给他一个什么多么吧?这意味着你可以在大多数的情况下处理嘛,就像它是一个字符串一样,Window等于它就是window哈。这一套。同义词吗?懂吗?那这个属性里面是不是没有把这个哈服给他标出来啊,不太友好,可是他肯定是有哈服属性的,对不对?你看是跳转到一个什么页面去了,能理解吗?它也就是什么可以用来处理这个页面的跳转的,能理解,那我现在这么写了是不是location.half等于this.half this不就是你的A标签吗?那A标签里面这个哈不就是它吗?是不是啊,那这个时候看能不能调好,我们应该去哪看。手机上看吧。好,我刷刷一把走你。
31:00
来看我点一下能不能跳。是不是可以跳那么理解。是不是可以跳,OK,那说明咱们是不是已经写完了。你看我们第一有没有禁止事件模行为有A标签,现在能不能跳?可以跳吧,可是我问你,好,我们再来看。过来,我问你,我在滑的时候,他该不该跳?不不不。嗯,马呢?马怎么没了?马没了。上去。啊,这个视频会发出去的。
32:05
你红了,得给我钱七点。生成二维码,再来一波。嗯。来一波。OK啊,来扫一波。OK。哎,这也好。你看我是不是在扫啊,真的卡住了。然后重新来扫啊,你们稍微等一等。我们再讨论一个什么问题啊,我们说你光点是不可以的问题,就怕你滑吧,你滑的时候能触发这个跳转吗。
33:03
滑的时候干嘛不应该触发跳转吗?扫一下OK,大家看现在我在划的时候,大家看有没有瞬间跳转。有时间跳转吗?可是我只是想做一个滑屏操作吧,那要不要解决误触,这这个是不是误错,要不要解决误错好怎么解决误错。如果你划过了,我在他这摁的时候干嘛?告诉你不要跳了。是不是如果你刚刚有触发过touch木,你在touch摁的时候就不要跳了,如果你是从touch直接跳过来的。那你就在这边跳转。是不是这个道理啊,那怎么办?我说你这边跳有一个前提。夜什么?好,我能不能这上面我给你去把一个叫做也是的。
34:05
这个就代表你有没有经历过他欺步,如果有经历过他进步的话,他就是去了。懂吗?这个待会自己去写不就行了吗?是不是,是不是你没有他起步的时候你才去跳,懂不懂,那我在他起步的时候干嘛。只要你能进入我这个回调,说明是触发的,他提供函数。那个嘛,This点什么。为什么?是不是真的?能不能理解在我他的最后一步要要不要把它重置回来。它切的最后最后一步,要不要把它重置回来?你手指都已经离开了,下一次是不是得重新计算了?那么你在这边要不要把this点也制成first?
35:02
要的吧,那问你在他的最后一步把this点成,或跟在他的第一步把this点成不一样。他的最后一步不就是我他知道的第一步嘛,是吧,所以说我写起逻辑段话,我喜欢干嘛。在他是什么的时候把this是什么。那没讲这样的话,咱们是不是就可以解决无错,这是移动端A标签的跳转。方案,而且这个方案是干嘛解决了是吗?悟出的,那么你讲好,再来看一看,好。我是不是重新扫一扫。好,接着看,好看我滑。
36:02
跳吗?跳吗?你看我点上去滑吧,跳吗?不跳是不是不跳,除非你从在他身上点的。你还从他身上抬起来了,是不是,如果如果有说,哎,那我干嘛从他身上点的。慢讲,从他身上点的,我划一圈,我再回到他身上,我我也想让他跳,你是不是有毛病,这个就不要处理了,那没讲,只要你划过来干嘛,那就不跳了等等。好,那在这一块移动端的跳转方案也说完,对不对啊,这节课比较重要,我们讲了一个隐患事件点透移动端跳转方案能理解吧?啊,当然这些东西是结合上一节课都去说的啊,就说这两节课东西应该不是太难。应该可以把它给当场就处理掉的啊,自己先看看。
我来说两句