首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

如何实现选择控件和textbox控件显示内容的互动

2012-03-05 
怎么实现选择控件和textbox控件显示内容的互动?多项选择然后textbox控件里面的内容是根据多项选择里面的选

怎么实现选择控件和textbox控件显示内容的互动?
多项选择
然后textbox控件里面的内容是根据多项选择里面的选择项动态生成的?
这样的功能   怎么用   javascript脚本来实现啊?


[解决办法]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME= "Generator " CONTENT= "EditPlus ">
<META NAME= "Author " CONTENT= " ">
<META NAME= "Keywords " CONTENT= " ">
<META NAME= "Description " CONTENT= " ">
</HEAD>

<BODY>
<select onchange= "dd(this) ">
<option value= "1 "> 11 </option>
<option value= "2 "> 22 </option>
</select >
<input type= "text " name= "aa " id= "aa ">
<script>
function dd(a){
if(a.value== "1 "){
document.getElementById( "aa ").value= "11 "
}
if(a.value== "2 "){
document.getElementById( "aa ").value= "22 "
}
}
</script>
</BODY>
</HTML>
[解决办法]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> test </title>
<script type= "text/javascript ">
function itemCheck()
{
var ochkForm= document.getElementById( 'resForm ');
var oText = document.getElementById( 'content ');
var ochkBoxes= ochkForm[ 'items[] '];
oText.value = ' ';
for(var i = 0 ; i <ochkBoxes.length; i++ )
{
if ( ochkBoxes[i].checked )
oText.value += ochkBoxes[i].value+ ' ';
}
}
</script>
</head>
<body>
<form id= "resForm " name= "resForm " >
<textarea id= "content " name= "content "> </textarea>
<br>
<input type= "checkbox " name= "items[] " value= "1 " onclick= "itemCheck() "> 选项1 <br/>
<input type= "checkbox " name= "items[] " value= "2 " onclick= "itemCheck() "> 选项2 <br/>
<input type= "checkbox " name= "items[] " value= "3 " onclick= "itemCheck() "> 选项3 <br/>
<input type= "checkbox " name= "items[] " value= "4 " onclick= "itemCheck() "> 选项4 <br/>
</form>
</body>

</html>

[解决办法]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME= "Generator " CONTENT= "EditPlus ">
<META NAME= "Author " CONTENT= " ">
<META NAME= "Keywords " CONTENT= " ">
<META NAME= "Description " CONTENT= " ">
</HEAD>

<BODY>
<select onchange= "dd(this) ">
<option value= "1 "> 11 </option>


<option value= "2 "> 22 </option>
</select >
<input type= "text " name= "aa " id= "aa ">
<script>
function dd(a){
if(a.value== "1 "){
document.getElementById( "aa ").value= "11 "
}
if(a.value== "2 "){
document.getElementById( "aa ").value= "22 "
}
}
</script>
</BODY>
</HTML>

[解决办法]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN "
"http://www.w3.org/TR/html4/loose.dtd ">
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> 无标题文档 </title>
</head>

<script language= "javascript ">

function set(tvalue){ document.all( "bb ").value=tvalue}

</script>
<select name= "select " onChange= "set(this.value) ">
<option value= "aa " selected> aa </option>
<option value= "bb "> bb </option>
</select> <br>
<br>
<br>
<br>

<input type= "text " id= "bb ">

</body>
</html>

热点排行