实现方法很简单：点击按钮时根据文本框值来显示相应的单选组，懂点js的都能解决
本文实例讲述了js使用DOM设置单选按钮、复选框及下拉菜单的方法。分享给大家供大家参考。具体实现方法如下：1.设置单选按钮
单选按钮在表单中即<input
type="radio"
/>它是一组供用户选择的对象，但每次只能选一个。每一个都有checked属性，当一项选择为ture时，其它的都变为false.
先贴上一个例子：
复制代码
代码如下:<script
type="text/javascript">
function
getChoice()
{
var
oForm
=
document.forms["uForm1"]
var
aChoices
=
oForm.camera
for
(i
=
0
i
<
aChoices.length
i++)
//遍历整个单选项表
if
(aChoices[i].checked)
//如果发现了被选中项则退出
break
alert("相机品牌是："
+
aChoices[i].value)
}
function
setChoice(iNum)
{
var
oForm
=
document.forms["uForm1"]
oForm.camera[iNum].checked
=
true
}
</script>
<form
method="post"
name="uForm1"
action="addInfo.aspx">
相机品牌：
<p>
<input
type="radio"
name="camera"
id="canon"
value="Canon">
<label
for="canon">Canon</label>
</p>
<p>
<input
type="radio"
name="camera"
id="nikon"
value="Nikon">
<label
for="nikon">Nikon</label>
</p>
<p>
<input
type="radio"
name="camera"
id="sony"
value="Sony"
checked>
<label
for="sony">Sony</label>
</p>
<p>
<input
type="radio"
name="camera"
id="olympus"
value="Olympus">
<label
for="olympus">Olympus</label>
</p>
<p>
<input
type="radio"
name="camera"
id="samsung"
value="Samsung">
<label
for="samsung">Samsung</label>
</p>
<p>
<input
type="radio"
name="camera"
id="pentax"
value="Pentax">
<label
for="pentax">Pentax</label>
</p>
<p>
<input
type="radio"
name="camera"
id="others"
value="其它">
<label
for="others">others</label>
</p>
<p>
<input
type="submit"
name="btnSubmit"
id="btnSubmit"
value="Submit"
class="btn">
</p>
<p>
<input
type="button"
value="检测选中对象"
onclick="getChoice()">
<input
type="button"
value="设置为Canon"
onclick="setChoice(0)">
</p>
</form>
借助JQuery更简单实现，这里是一个用原生javascript实现的示例：
<html>
<head>
<title></title>
<script type="text/javascript">
function addButton(){
var html ="<input type=\"button\" value=\"新加\" onclick=\"newButton()\">"
document.getElementById("add").innerHTML=html
}
function newButton(){
alert("我是新加的按钮")
}
</script>
</head>
<body>
<div>
<p>点击该按钮增加一个新按钮</p>
<input type="button" value="点击增加" onclick="addButton()">
<p>新增的按钮在这显示</p>
<div id="add"></div>
</div>
</body>
</html>
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。
它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）