`
Dxx23
  • 浏览: 141121 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

单选框,复选框,下拉框的取值

阅读更多

1.单选框

<html>
<head>
<script type="text/javascript">
function check(fruit)
  {
      alert("你喜欢的水果是:"+fruit)
  }
</script>
</head>
<body>

<p>您喜欢哪种水果?</p>

<form>
<input type="radio" name="fruit" onclick="check(this.value)" value="苹果">apple<br />
<input type="radio" name="fruit" onclick="check(this.value)" value="香蕉">banana<br />
<input type="radio" name="fruit" onclick="check(this.value)" value="梨">pear<br />
</form>

</body>
</html>

 

 

2.复选框

<html>
<head>
<script type="text/javascript">
function createOrder()
{
food=document.forms[0].food
txt=""
for (i=0;i<food.length;++ i)
{
if (food[i].checked)
{
txt=txt + food[i].value + " "
}
}
alert("您订购的早点有: " + txt)
}
</script>
</head>

<body>
<p>你需要什么样的早点?</p>
<form>
<input type="checkbox" name="food" value="油条">油条<br />
<input type="checkbox" name="food" value="豆浆">豆浆<br />
<input type="checkbox" name="food" value="鸡蛋">鸡蛋<br />
<br />
<input type="button" onclick="createOrder()" value="发送订单">
<br />
</form>
</body>

</html>

 

 

3.下拉框

<html>
<head>
<script type="text/javascript">

function changeFruit()
{
 var myselect=document.getElementById("mySelect")
 alert(myselect.options[myselect.selectedIndex].text)
 if(myselect.options[myselect.selectedIndex].text == "桃子")
    {
         myselect.disabled = true;
    }
}

function enable()
  {
   document.getElementById("mySelect").disabled=false      
  }

</script>
</head>
<body>

<form>
<select id="mySelect" onchange="changeFruit()">
  <option></option>
  <option>苹果</option>
  <option>桃子</option>
  <option>香蕉</option>
  <option>桔子</option>
</select>
<br />
<input type="button" onclick="enable()" value="启用列表">
</form>

</body>
</html>

 

1
0
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics