Posts tagged with input

诡异的radio表单问题

2006-12-22 13:57:46 | Edit | Tagged: , and | 4 Comments

今天做项目的时候,发现了这个诡异的问题：js动态创建的radio元素在IE下不能被选中的问题。

点这里看这个诡异的问题

第一种情况用document.createElement创建input元素，然后用setAttribute为它设定type＝radio，不过在IE下的效果，一点便知，不能选择...

第二种情况用innerHTML直接把input type="radio" name="radio2"输出，确却是可以的，无语了...

希望知道原因的朋友不吝赐教。

使IE也支持属性选择器和focus行为

2006-08-11 08:54:08 | Edit | Tagged: , , , and | 2 Comments

你是不是还在不厌其烦地为每种表单元素（input）类型（type）加上相应的class,（text、password、file...），Firefox, Opera等可以支持属性选择器input[type="???"]及其伪类:focus，那IE怎么办？我们还有javascript。

遍历所有的input元素

var input= document.getElementsByTagName("input");
	for (var i = 0; i < input.length; i++)
	{
		input[i].className = input[i].type;
		
	}

给相应type的input定义一个className，名称等同于type，（type="password"则它的class="password"）。focus的效果可以用onfocus和onblur

input[i].onfocus = function() {
	this.className = this.className + " " + this.className + "focus";
}
input[i].onblur = function() {
	this.className = this.type;
}

然后定义相应事件下的样式，比如.textfocus, .passwordfocus等。最后你当然要判断一下，因为Firefox, Opera不需要这些代码的支持，所以

window.onload = function() {
	if (document.all && !window.opera) //判断是否为IE
	{
		styleform();
	}	
}

具体效果看这里

 1