js怎么修改input的type属性ie不出错

JavaScript09

js怎么修改input的type属性ie不出错,第1张

js修改input的type属性并且兼容ie的实现方法如下:

1、定义html中需要改变type的input控件::

<input type="text" value="Username" name="username" id="username"

onFocus="javascript:focusCheckDefaultValue(this, '', 'Username -OR- Email Address')"

onBlur="javascript:blurCheckDefaultValue(this, '', 'Username -OR- Email Address')">

<input type="password" value="Password" name="pass" id="pass"

onFocus="javascript:focusCheckDefaultValue(this, 'pass', 'Password')"

onBlur="javascript:blurCheckDefaultValue(this, 'pass', 'Password')">

<script type="text/javascript" language="JavaScript">

2、定义处理type改变的js函数:

$(document).ready(function()

{

var passfield = document.getElementById('password_field_id')

passfield.type = 'text'

})

function focusCheckDefaultValue(field, type, defaultValue)

{

if (field.value == defaultValue)

{

field.value = ''

}

if (type == 'pass')

{

field.type = 'password'

}

}

function blurCheckDefaultValue(field, type, defaultValue)

{

if (field.value == '')

{

field.value = defaultValue//不修改,默认属性

}

if (type == 'pass' &&field.value == defaultValue)

{

field.type = 'text'//修改为text

}

else if (type == 'pass' &&field.value != defaultValue)

{

field.type = 'password'//修改为password

}

}

</script>

type 和 language 属性都可用来指定 <script>标签中的脚本的类型。

language 属性在 HTML 和 XHTML 标准中受到了非议,这两个标准提倡使用 type 属性。遗憾的是,这两个属性的值是不一样的。

如果您在使用 JavaScript,可以使用下面两种属性:

language = "JavaScript"

或者:

type = "text/javascript"

您可能偶尔会看见 language 的值为 VBScript(对 type 而言是 text/vbscript),表示包含的脚本代码是用 Microsoft 的 Visual Basic Script 编写的。

利用 JavaScript,您还可以使用 language 的值 "JavaScript 1.1",表示包含的脚本语句只能被 Netscape 3.0 或更新的版本处理。Netscape 2.0 只支持 JavaScript 1.0,而无法处理标记为 "JavaScript 1.1" 的脚本。

language不赞成使用。规定脚本语言。请使用 type 属性代替它

1.修改表单内特定类型元素的值

form.elements[]属性:除了跟踪表单中每种类型的元素外,浏览器还保留了一张表单中所有控件元素的列表,元素的顺序就是在HTML中的位置,所以对引用相当的方便。

代码如下:

<%@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />

<title>表单(修改表单属性,修改表单元素值)</title>

<script language="javascript">

function gaibian()

{

var acti=document.getElementById("select").value//得到ID为select元素的值

var mont=document.getElementById("select2").value//同上

document.form1.action=acti//设置值

document.form1.method=mont//同上

}

function bian()

{

var form=document.forms[1]//将当前页第二个表单赋给变量form,以便以后引用

for(var i=0i<form.elements.lengthi++)//循环表单内的元素数组的最大项

{

if(form.elements[i].type=="text")//如果当前元素的类型是text

{

form.elements[i].value="田洪川"//那就把他的值赋成 田洪川

}

if(form.elements[i].type=="checkbox")//如果是复选框

{

if(form.elements[i].checked)//如果是选中的

{

form.elements[i].checked=null//取消选择

}

else

{

form.elements[i].checked="checked"//就给他选中

}

}

}

}

</script>

</head>

<body>

<p>其实在<a href="http://www.cnblogs.com/thcjp/archive/2006/08/08/470997.html">

<p><strong>根据需求,定做表单</strong></p>

<p>按下提交提交表单,后退,然后再点修改表单,然后再提交表单,看效果</p>

<form id="form1" name="form1" method="post" action="http://127.0.0.1/">

现在的指向是 test.asp ,方法是 post

<input type="submit" name="Submit2" value="提交表单" />

</form>

<p>

<select name="select">

<option value="http://thcjp.cnblogs.com/">博客</option>

<option value="http://163.com/">网易</option>

</select>

<select name="select2">

<option value="GET">get</option>

<option value="post">post</option>

</select>

<input type="submit" name="Submit" value="修改表单" onclick="gaibian()" />

</p><hr />