input框ie监听问题
在使用input事件,主流浏览器当然是没有问题。input事件肯定是要做验证吧,验证信息有问题肯定要focus吧,ie11用input事件可以起作用,但是会在一刷新页面就去执行input事件,无论怎么刷新都会一直focus,你要有好几个输入框,好家伙,一个个轮流给你focus,placeholder在ie中是输入框一获取焦点就消失,不像谷歌要开始输入后才消失,就导致ie中也看不到提示文字。之前项目中有好几个input框的input事件,然后每个都有focus(),就导致输入框循环去获取焦点,页面直接卡死,心累!
度娘找了input框实时监听办法,大多是这样的
if (document.all) {
searchInput.onpropertychange = function () {
text.innerHTML = searchInput.value
}
}
// 非IE
else {
searchInput.addEventListener('input', function () {
text.innerHTML = searchInput.value
})
}
emmmmmm document.all是什么鬼?IE对document有个属性是all,表示所有的DOM对象,现在已经不能这样用了,ie11会走else,ie7/8/9/10会走if,所以不能这样用了,不行可以试试。于是找了这个方法
if(!!window.ActiveXObject||"ActiveXObject" in window){
console.log("is IE");
var inputtext = document.getElementById('hhh');
inputtext.onpropertychange=function(){
$(this).siblings('p').show().html($(this).val());
}
}
else{
console.log("no");
$('#hhh')[0].oninput=function(){
}
}
这样就可以判断是不是ie拉。但是
问题又出来了,我在ie里绑定的onpropertychangem不起作用,ie10及其以下是可以的。解决了ie判断问题又出来ie11不支持,那我的判断还有什么意义呢。。。。难受!!! ie11能用input事件,因为一开始说了会一开始就focus,除非你的校验方法里不要focus就好了。我的里边有,最后改成了ie(11,10,9…)中,用其他事件来绑定,比如keyup,keydown。
最后就改成这样啦啦啦
if(!!window.ActiveXObject||"ActiveXObject" in window){
console.log("is IE");
$('body').on('keyup','#hhh',function(){
//校验有问题之后.focus();
$(this).siblings('p').show().html($(this).val());
})
}
else{
console.log("no");
$('body').on('input','#hhh',function(){
$(this).focus();
$(this).siblings('p').show().html($(this).val());
})
}
前端菜鸟第一次写 笔记 ,看了很多别人的结合自己的做个笔记,有问题希望大牛可以指正,不胜感激!笔芯!