精华内容
下载资源
问答
  • 看到这标题,是不是...阻止浏览器默认行为,真的能阻止吗?那到底是什么样的方案,会有这样的质疑? 那,就是它了,别看,就是你: //阻止浏览器默认行为触发的通用方法 function stopDefault(e){ //防...

    看到这标题,是不是有点逆天的感觉,总感觉好狂拽炫酷,耳边隐隐约约传来一个声音:你这么叼,你咋不上天呢! ~~ 额,好吧!

    话入正题,我为什么会提出这么一个问题呢?

    阻止浏览器默认行为,真的能阻止吗?那到底是什么样的方案,我会有这样的质疑?

    那,就是它了,别看,就是你:

    //阻止浏览器默认行为触发的通用方法  
    function stopDefault(e){  
    	//防止浏览器默认行为(W3C)  
    	if(e && e.preventDefault){  
    		e.preventDefault();  
    	}  
    	//IE中组织浏览器行为  
    	else{  
    		window.event.returnValue=fale; 
    		return false; 
    	}  
    }  
    

    没错,就是你,这个在网上一搜,基本上非常通用的解决方案,以前我也对这种方法深信不疑,觉得这是前辈们的多少次实践论证出来的东西,应该是精品,但是就在我写拖拽效果的时候,在阻止浏览器默认行为时,发现在IE8下,居然嗝屁了,

    你不信?那就让我们一起来看看,上面的解决方案在IE8以下的表现吧!当然,标准浏览器是没有问题的啦,毕竟e.preventDefault() 方法还是杠杠的。

    首先我们要明确一下,什么是浏览器的默认行为,举个栗子:

    页面上有一行文字,如果我选中,然后拖动文字,那么文字可以被拖动,拖动后再松手,可能被选中的文字就去搜索了,由于此效果不好截图,你们自己去玩一下,那这一行为就是浏览器的默认行为;

    再举个栗子:

    页面上有一张图片,点击图片,然后拖动,图片会好像是复制了一份,然后也是可以被拖动,这也是浏览器的默认行为,看看IE下的截图:

    这个样子的,你们应该司空见惯了吧,那浏览器厂家做的某些默认行为,我们为什么要想方设法的去阻止掉呢?因为我们在做某些效果的时候,浏览器的默认行为会影响我们的效果,比如说表单中的提交按钮,理论上的默认效果是我一点击就会将我的表单提交出去,

    但现实情况可能并不希望它这样,所以我们需要阻止一下。

    好了,我们来说说我们阻止浏览器的默认行为的神器吧,还是以图片和文字为例子,

    <img src="1.jpg" id="img1" alt="">
    <p id="text">圣诞节开发能顺利的烦恼时来得快耐腐蚀的快乐你发了十多年两三点扣年费是考虑到你发来看你</p>
    

    这是我们页面上的一张图和一行文字,随便打的

    window.onload = function(){
    		var oImg = document.getElementById("img1");
    		var oText = document.getElementById("text");
    		oImg.onmousedown = function(e){
    			stopDefault(e);
    			 
    		}
    		oText.onmousedown = function(e){
    			stopDefault(e);
    		}
    	
    		//阻止浏览器默认行为触发的通用方法  
    		function stopDefault(e){  
    			//防止浏览器默认行为(W3C)  
    			if(e && e.preventDefault){  
    				e.preventDefault();  
    			}  
    			//IE中组织浏览器行为  
    			else{  
    				window.event.returnValue=false; //实际上在IE8以下,会报错
    				return false; 
    			}  
    		}  
    	}
    

    这是用我们的神器来写的一个小例子,意思是当鼠标按下去的时候,我们来阻止浏览器的默认行为,看看都有什么表现,如果图片和文字不能被拖动,说明是可以阻止默认行为的,如果不能,呵呵,你就惨了~

    在标准浏览器上,good,没问题,完美,在IE上,IE9以上good,IE8下,呃呃(此处有音效),嗝屁了,它们依然快乐的到处游走,跟它们就没什么关系,由此可见,上面的神器是不足以来满足我们的要求的(毁三观啊)~

    那现在的问题就变了,怎样才能全面兼容阻止浏览器的默认行为呢?这就是标题的后半段要讲的内容了(主角来了)!

    首先,我们要肯定的是  e.preventDefault()  方法是绝对可以在标准浏览器下阻止默认行为的,但是(重点来了),我们今天不用这个方法,而是用  return false 这个熟悉的老朋友,当然关于return ,我们又可以讲一篇长长的博文,像老太太的裹脚布一样,

    这里我们不讲多么的详细,就提几点:

    return 表达式是结束函数执行,返回调用函数,没有返回结果,举个栗子:

    function adc(){
    	var a=2;
    	var b=3;
    	var sum = 0;
    	return ;
    			
    	sum = a+b;
    	console.log(sum);
    }
    adc();
    

    看上面的这个函数,如果没有return,那么console就会打印sum的值5,但是恰恰有个return,让函数在return后就不往下执行,而是返回到调用函数,所以就没有值了,

    那么return false呢,一般是返回错误的处理结果;终止处理;阻止提交表单;阻止执行默认的行为等等,值得注意的是,执行return false,其实是执行了3个行为:

    1、执行event.preventDefault();  阻止浏览器的默认行为;
    2、event.stopPropagation();  阻止冒泡行为;
    3、停止回调函数执行并立即返回。

    所以用此方法的时候,必须要考虑,你是否会有阻止冒泡的需求,如果有,我们就必须要用 event.preventDefault();来阻止浏览器的默认行为了,我们还是来举个栗子吧(一向的风格就是例子胜于雄辩):

    window.onload = function(){
    	var oImg = document.getElementById("img1");
    	var oText = document.getElementById("text");
    		
    	oImg.onmousedown = function(e){
    		return false; 
    	}
    	oText.onmousedown = function(e){
    		return false; 
    	}
    
    }
    

    还是用上面的例子,改写一下,看看效果如何, 恩,标准浏览器,杠杠的,再看IE,IE9以上依旧如此完美,IE8以下依旧那么飘逸,好吧,看来我们要解决的梗就是如何使IE8以下浏览器能乖一点!

    要解决这个问题,我先介绍一个方法(闪亮登场):

    setCapture()  //意思是在窗口设置鼠标捕获

    额,不懂,好吧,我也不懂,那我们就用例子来描述一下:

    <input type="button" value="按钮一">
    <input type="button" value="按钮二">
    

    页面上有2个按钮

    window.onload = function(){
    		var aInput = document.getElementsByTagName("input");
    		//设置全局捕获,当我们给一个元素设置全局捕获后,这个元素就会监听后续的所有事件,当有事件发生的时候,就会被当前设置了全局捕获的元素所触发
    		
    		/*
    			ie : 有,并且有效果
    			ff : 有,但没有效果
    			chrome : 没有,会报错
    		*/
    		
    		aInput[0].setCapture();
    		
    		aInput[0].onclick = function(){
    		 	alert(1);	
    		};
    		aInput[1].onclick = function(){
    		 	alert(2);	
    		}
    		
    		
    	}
    

    分别给2个按钮设点击事件,并且给按钮一开一个小灶,给它设一个全局的鼠标捕获,我们来看看,谷歌下,会报错,不支持,火狐下,没有报错,也没有别的什么反应,一切正常,说明火狐是支持的,只是没反应(因为不报错),IE下,怪异情况就出现了

    无论我的鼠标在哪里点击,都会弹出1,就算是点击按钮2,也会弹出1,点到窗口外,也会弹出1,这是为什么呢?我查了一下资料,大概的解释是:

    函数功能:该函数在属于当前线程的指定窗口里设置鼠标捕获。一旦窗口捕获了鼠标,所有鼠标输入都针对该窗口,无论光标是否在窗口的边界内。同一时刻只能有一个窗口捕获鼠标。如果鼠标光标在另一个线程创建的窗口上,只有当鼠标键按下时系统才将鼠标输入指向指定的窗口。

    通俗的意思是:当某个元素设置了全局鼠标捕获,那个这个元素就会监听后续发生的所以事件,当有事件发生的时候,就会被当前设置了全局捕获的元素触发,

    所以,我们看上面例子的怪异表现,当鼠标点击的时候,就会被绑定了全局捕获的按钮一所触发,那会执行按钮一的点击事件,所以会弹出1;

    那么它是怎么来阻止浏览器的默认行为的呢?举个栗子:

    window.onload = function(){
    	var oImg = document.getElementById("img1");
    	var oText = document.getElementById("text");
    		
    	oImg.onmousedown = function(e){
    		oImg.setCapture();
    	}
    	oText.onmousedown = function(e){
    		oText.setCapture();
    	}
    
    }
    

    我们都知道这个在标准浏览器上是不行的,我们暂时不管,只看IE的,你会发现,在IE上,一下子就老实了,再也不到处跑了,这是为什么呢?用上面的解释就是,因为此时图片和文字都设了全局鼠标捕获,不管页面上有什么事件发生,都会转移到它们身上,我们又

    没有给它们写move事件,所以就很乖乖的在那里不动了,明白了吗?

    那我们给图片加个自定义的move事件,看看会怎样?(此时这里的图片是绝对定位的,样式我就不写了)

    window.onload = function(){
    	var oImg = document.getElementById("img1");
    	oImg.onmousedown = function(ev){
    		var ev = ev || event;	
    		var disX = ev.clientX - this.offsetLeft;
    		var disY = ev.clientY - this.offsetTop;
    		if(oImg.setCapture){
    			oImg.setCapture();
    		}
    		document.onmousemove = function(ev){
    			var ev = ev || event;
    			oImg.style.left = ev.clientX - disX + 'px';
    			oImg.style.top = ev.clientY - disY + 'px';
    		};
    		document.onmouseup = function(ev){
    			document.onmousemove = document.onmouseup = null;
    			if(oImg.releaseCapture){  //取消全局捕获
    			  oImg.releaseCapture();	
    			} 	
    		};
    					
    		return false;	   
    	  }
    	
    	}
    

    运行一下,感觉整个世界都平静了,再也没有纷争了,所以浏览器都表现一致,这就是一个简易的拖拽效果,这就是我给我解决方案,不知道你们是否满意呢!嘻嘻~~

    当然,需要特别注意的是(多啰嗦一句):

    1、如果是需要阻止所有的默认事件,那么我们用return false 和 obj.setCapture() 方法一起用;

    2、如果我们仅仅只是想阻止浏览器的默认行为,可以用event.preventDefault() 与 obj.setCapture()方法一起用,这里是考虑到冒泡;

     

    好了,基本上就这些了,阻止冒泡方法我也试了一下,还是挺兼容的,代码我也贴一下,换算优惠大赠送吧!

    if ( e.stopPropagation ){ //标准浏览器 
        e.stopPropagation(); 
    }else{ 
        //兼容IE的方式来取消事件冒泡 
        window.event.cancelBubble = true; 
    } 
    

    以上方法只是个人意见,如有什么理解的不对的,或者是有错误的地方,欢迎批评指正,也欢迎大家跟我交流技术方面的知识,谢谢大家!

    ps:如果你看过我写的pc拖拽效果,请看的时候参考一下本文,哪里的阻止默认事件写错了,记得修改!

     

    转载于:https://www.cnblogs.com/liugang-vip/p/5315787.html

    展开全文
  • ”,阻止了滑动的默认事件,可是整个页面就阻止了,都不能向下观看了,瞬间感觉还尴尬,主要是scoll的一个监听理解,还要处理各个情况的监听。。。。加上下面一段代码就好了..... var overscoll = function (el){...

    今天有个朋友问我,他再做个项目,微信的一个小项目,在下滑屏幕的时候,上面总出现一个白条,显示“提供内核。。。”,阻止了滑动的默认事件,可是整个页面就阻止了,都不能向下观看了,瞬间感觉还尴尬,主要是scoll的一个监听理解,还要处理各个情况的监听。。。。加上下面一段代码就好了.....

    var overscoll = function (el){
    el.addEventListener('touchstart',function(){
    var top = el.scrollTop;
    totalScroll = el.scrollHeight;
    currentScroll = top + el.offsetHeight;
    if(top === 0){
    el.scrollTop = 1;
    }else if(currentScroll === totalScroll){
    el.scrollTop = top - 1 ;
    }
    });
    el.addEventListener('touchmove',function(evt){
    if(el.offsetHeight < el.scrollHeight){
    evt._isScroller = true;
    }
    });
    }
    overscoll(document.querySelector('.scroll'));
    document.body.addEventListener('touchmove',function(evt){
    if(!evt._isScroller){
    evt.preventDefault();
    }
    });
     
    还可以进入个人博客:www.jishubar.cn

    转载于:https://www.cnblogs.com/wanglaowu/p/6138219.html

    展开全文
  • 所想

    2006-11-06 02:25:00
    每每到写作的时候,总是无处下笔,可是的思维在跳跃,可在狭窄的片面摸索,也可以在宏大的领域中穿梭,可就是无法让其展现于你的眼前,无法不是永远的不能,其阻止不了写的渴望。渴望写所想,虽不能...

    写我所想,我的心在想。我的手在实现,我的所想。
    每每到写作的时候,总是无处下笔,可是我的思维总在跳跃,
    我可在狭窄的片面摸索,也可以在宏大的领域中穿梭,
    可我就是无法让其展现于你的眼前,无法不是永远的不能,
    其阻止不了我写的渴望。
    我渴望写我所想,虽不能下笔如有神,洋洋洒洒。 

    展开全文
  • 奈何近些年网络技术发展太快,有些地方已经严重到不能访问的地步,这怎么可以,总不能阻止我一颗积极向上好好学习的心呐。 笔者也曾经历过这样的痛苦:打开Github主页要半分钟或一分钟,clone一个项目下...

    关注我,即可解锁我的全部博文。欢迎大家点赞、留言与我交流


    说到全球最大的程序员基友网站,大家一定都知道!

     没错,就是全球最大的开源社区——Github。

    日常撸代码,我们最常用的就是他。奈何近些年网络技术发展太快,有些地方已经严重到不能访问的地步,这怎么可以,总不能阻止我一颗积极向上好好学习的心呐。

    笔者也曾经历过这样的痛苦:打开Github主页要半分钟或一分钟,clone一个项目下来,还要靠运气,运气不好可能跑到半路就跪了,真是让人脑壳疼。

    不过现在解决办法来了!

    I(挨)T(踢)圈的朋友们应该都知道,当我们在网站上输入github.com的时候他首先是先请求dns服务器解析地址,也就是把github.com转换成一个IP地址返回给我们让我们去访问。但是在默认情况下可能这个IP地址并不是最优解,严重的情况下ping值都达到了上千毫秒,那还玩个P了。。。,这个时候我们就需要切换成手动模式。

    那么问题来了,如何切换成手动挡操作?总不能自己抠脚吧?也太傻了

    这里给大家安利一个神器,下载地址大家可以关注我的公众号:后台回复 dns ,我会把所有工具的地址发给你

    它是一款基于Python编写的APP,可以帮助我们手动改掉默认的返回的IP来达到加速访问的目的,而且可以跨平台运行!mac和windows的盆友再也不用剁手了!

    那么问题又来了,我该去哪找这些我访问速度最快的IP呢?

    这里再给大家推荐一个神奇的网站:站长工具DNS检测

    好了,拥有了这两个神器我们就可以开始搞(sao)事(cao)情(zuo)了

    首先,打开DNS检测网站:

    然后,把下面的这些地址,每一个都用这个网站检测一下(我已经贴心的设置为文本模式了,可以直接复制):

    gist.github.com
    assets-cdn.github.com
    raw.githubusercontent.com
    gist.githubusercontent.com
    cloud.githubusercontent.com
    camo.githubusercontent.com
    avatars0.githubusercontent.com
    avatars1.githubusercontent.com
    avatars2.githubusercontent.com
    avatars3.githubusercontent.com
    avatars4.githubusercontent.com
    avatars5.githubusercontent.com
    avatars6.githubusercontent.com
    avatars7.githubusercontent.com
    avatars8.githubusercontent.com
    www.github.com

    找TTL值最小的进行规则匹配,规则匹配方法如下,举个例子:

    可以看到,经过dns检测后,湖南的这个地址TTL(Time to live)值是最小的。

    接下来我们就打开swicthHost,然后点击左下角的加号

    然后就会出现这个对话框:

     输入一个你喜欢的名字命名为规则,之后点击确定,然后按这个格式,把地址写好:

    大家可以看到,我不光添加了github的地址,而且还添加了stackoverflow,这样,我就可以肆意开车了。

    但是这里有一点还是要说的,就是如果被国内GW封禁了的话,那添加了DNS也是没用的。

    添加完DNS,还要记得把这个DNS规则的开关打开:

    好了,这个时候我们重新打开浏览器,浏览器就会按照我们配置好的规则进行访问啦,怎么样,是不是感觉快多了?

    说重点!


    给看到这里并且关注我的朋友来点福利。

    大家在公司里开发的时候是不是经常会有切换线上、线下、或者测试环境的场景,常规的方法我们是需要通过修改代码来实现的,但是有了SwitchHost就省事多啦,我们可以把每个环境的规则单独配置好,需要哪个环境,激活他就可以啦,从此切换环境so easy!

    有什么想法欢迎大家在留言区与我交流


    最后还是想邀请大家关注公众号,互联网史上最豪横干货,都在这里

    展开全文
  • 与计算机

    2016-09-18 18:31:00
    后来在上初三的时候就报了职高,在职高上了三年仅学习了一点点皮毛而已,但是并不能阻止我对计算机深深的热爱。计算机是门学无止境的技术,感觉自己所了解的都不够多。目前计算机是世界发达国家激烈竞争的科学技术...
  • 最近越来越不能控制自己的生活节奏了,被一些自己不想做的事操纵着……不要这样,就是以自我为中心,就是这种人,你们爱怎么说怎么说,你们能拿怎么样?的生活自己掌握,不要你们指手画脚,要做...
  • RT,忽然就对技术没有了虔诚的感觉,具体地来说,觉得技术就是多动手的产物,毫无高深可言,也许有很多东西一辈子也不能窥其一斑,不得其奥秘,但是这不能阻止我丢失对技术的虔诚感. 回顾过往的2年以及...
  • 在gdb中显示源码 -- gdbtui使用方法

    千次阅读 2016-11-25 14:24:30
    gdb里面可以用list命令显示源码,但是list显示没有代码高亮,我忍了,可是list这种显示代码的方式,使得我总不能一眼定位到正在执行的那行代码。 可以毫不夸张的说,这个问题是阻止我长期使用gdb的最大的障碍。这是...
  • 导致数据加载出来,解决方法是加一个延迟,等数据先加载出来再操作 drop_down() get_product() if __name__ == '__main__': kw = input('请输入你想查询的商品:') driver = webdriver.Chrome() ...
  • GDB TUI 界面调试

    2020-03-13 17:25:25
    gdb里面可以用list命令显示源码,但是list显示没有代码高亮,我忍了,可是list这种显示代码的方式,使得我总不能一眼定位到正在执行的那行代码。 可以毫不夸张的说,这个问题是阻止我长期使用gdb的最大的障碍。这是...
  • 在gdb中显示源码(gdbtui使用方法)

    千次阅读 2014-11-04 14:16:44
    gdb里面可以用list命令显示源码,但是list显示没有代码高亮,我忍了,可是list这种显示代码的方式,使得我总不能一眼定位到正在执行的那行代码。 可以毫不夸张的说,这个问题是阻止我长期使用gdb的最大的障碍。这是...
  • remark一些小小东西

    2011-04-05 16:27:00
    setModal(true),能阻止其他窗口输入,即不能点到该程序的其他窗口。 setAlwaysTop(),设置窗口是否在最前。 如何在显示图片? 方法一,用jlabel,seticon 方法二,用jpanel,用里面的paintComponent()方法...
  • 不会强求它留在那里,也无法阻止它要走的路。这仿佛是人生征程的写照。人生每一段都要走,每一步都不会停留。  生命是一条充满未知的路。路上遇到的每个人都匆匆地来,又匆匆地去。每个人都愿意停止自我的...
  • 等闲平地

    2018-09-08 20:01:00
    不是很拿得准方向,毕竟AI个人还是很喜欢的,但是觉得本科阶段AI学习很难讲,也不太懂,但是不管怎么样,还是得按照之前的构想走,又刚好接触到了zp学长拖的voj专题,那就算是暑假头给打没了,那也不能阻止我对于...
  • 万里长征,步履维艰

    2010-11-12 15:53:00
    想想都会很难,每次不让多吃,他的那句“那也不能不吃饱啊”,把噎得不能继续阻止。 其实吃饭吃到7,8分饱真的很舒服的,不会觉得胃涨涨的,也不会饿,就不会发胖。自己深深体会到了这的好处。每...
  • 2021-04-19

    2021-04-19 20:06:01
    不会强求它留在那里,也无法阻止它要走的路。这仿佛是人生征程的写照。人生每一段都要走,每一步都不会停留。 ​  生命是一条充满未知的路。路上遇到的每个人都匆匆地来,又匆匆地去。每个人都愿意停止自我...
  • 这是无与伦比的井字游戏-电脑总能取胜! 这是一个使用Javascript,HTML和CSS的完整的客户端应用程序。 它提示您的第一件事是选择玩家1是否是人类,您可以单击“确定”(是)或“取消”(否)。 它询问的第二件...
  • 今天工程经理说dell笔记本回家以后不能上网,提示连接限制,既然这种情况也没必要跑到家里去看的×××提供商就好了的。后来补充打开浏览器有一个网址自动弹出填入帐号密码即可,问题是窗口无法弹出。这样描叙的...
  • XP默认是把从网络登录的所有用户都按来宾账户处理的,因此即使管理员从网络登录也只具有来宾的权限,若遇到不能访问的情况,请尝试更改网络的访问模式。打开组策略编辑器,依次选择“计算机配置→Windows设置→安全...
  • 10.用户标签选择器超出输入个数限制时,不能阻止用户继续添加 11.管理员在后台奖罚积分时,用户的等级不会变化 12.解决IE下做更新删除操作时,列表不能显示最新数据问题,例如:空间管理标签页删除标签。 13.空间...
  • 会计理论考试题

    2012-03-07 21:04:40
    A、可恢复 B、可以在“回收站”中找到 C、可以恢复 D、可以在“的公文包”中找到 15.下列软件中属于系统软件的是 ___D__ 。 A、Windows B、Visual FoxPro C、UCDOS D、WPS97 16.应用软件在计算机普及中起重要...
  • php高级开发教程说明

    2008-11-27 11:39:22
    当然,有了一个日益增大的免费工具函数库,依然不能满足全部需要,也不能优化这个库 以适应特殊需求,有些库太庞大以致不能随处安装,因为每一次选中都必须分析几百K字节的代 码,这将严重降低站点的性能。在这种...
  • jpivot学习总结.doc

    2011-12-09 08:38:08
    创建一个图表组件,这个图表组件的标签不能直接产生可见输出,它必须通过 WCF 的渲染标签才行。 chart 标签的主要属性如下: 属性名 必须 数据类型 是否能动态计算指定 描述 id 是 String 是 标签的 ID ...
  • 组织单元不能包括来自其他域的对象。组织单元是可以指派组策略设置或委派管理权限的最小作用域或单位。使用组织单元,用户可在组织单元中代表逻辑层次结构的域中创建容器。这样用户就可以根据用户的组织模型管理账户...

空空如也

空空如也

1 2
收藏数 33
精华内容 13
关键字:

我总不能阻止