为了实现输入表单提示文字特效,写了下面代码,为兼容IE8,添加了document.all检测浏览器,可是将addEventListener改成attachEvent,在IE8/IE6里面不能执行?
<input type='text' value='用户名' />
<input type='text' value='用户名' />
<script type="text/javascript">
function values(){
var get_input = document.getElementsByTagName("input");
for (var i=0;i<get_input.length;i++)
{
if(document.addEventListener)
{
get_input[i].addEventListener('focus',function(){if(this.value==this.defaultValue){this.value='';}});
get_input[i].addEventListener('blur',function(){if(this.value==''){this.value=this.defaultValue;}});
}
else
{
get_input[i].attachEvent('onfocus',function(){if(this.value==this.defaultValue){this.value='';}});
get_input[i].attachEvent('onblur',function(){if(this.value==''){this.value=this.defaultValue;}});
}
}
};
values();
</script>
似乎 attachEvent 的事件要加 on 的,你试一下get_input[i].attachEvent('onfocus',fn);
你把后面的东西都去掉,你会发现ie8其实支持的是addEventListener(不过有可能因为是调试器,所有支持的)
attachEvent中this指向window,网上找了个解决方法,自己看下吧~
function addEvent(element, type, handler) {
//为每一个事件处理函数分派一个唯一的ID
if (!handler.$$guid) handler.$$guid = addEvent.guid++;
//为元素的事件类型创建一个哈希表
if (!element.events) element.events = {};
//为每一个"元素/事件"对创建一个事件处理程序的哈希表
var handlers = element.events[type];
if (!handlers) {
handlers = element.events[type] = {};
//存储存在的事件处理函数(如果有)
if (element["on" + type]) {
handlers[0] = element["on" + type];
}
}
//将事件处理函数存入哈希表
handlers[handler.$$guid] = handler;
//指派一个全局的事件处理函数来做所有的工作
element["on" + type] = handleEvent;
};
//用来创建唯一的ID的计数器
addEvent.guid = 1;
function removeEvent(element, type, handler) {
//从哈希表中删除事件处理函数
if (element.events && element.events[type]) {
delete element.events[type][handler.$$guid];
}
};
function handleEvent(event) {
var returnValue = true;
//抓获事件对象(IE使用全局事件对象)
event = event || fixEvent(window.event);
//取得事件处理函数的哈希表的引用
var handlers = this.events[event.type];
//执行每一个处理函数
for (var i in handlers) {
this.$$handleEvent = handlers[i];
if (this.$$handleEvent(event) === false) {
returnValue = false;
}
}
return returnValue;
};
//为IE的事件对象添加一些“缺失的”函数
function fixEvent(event) {
//添加标准的W3C方法
event.preventDefault = fixEvent.preventDefault;
event.stopPropagation = fixEvent.stopPropagation;
return event;
};
fixEvent.preventDefault = function() {
this.returnValue = false;
};
fixEvent.stopPropagation = function() {
this.cancelBubble = true;
};
function values() {
var get_input = document.getElementsByTagName("input");
for (var i = 0; i < get_input.length; i++) {
addEvent(get_input[i], 'focus', function() {
if (this.value == this.defaultValue) {
this.value = '';
}
});
addEvent(get_input[i], 'blur', function() {
if (this.value == '') {
this.value = this.defaultValue;
}
});
}
};
values();
用jq不好么- -
来源