40.选择不同列表项时显示不同的按钮 onChange 和 innerHTML 添加html代码

 1 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 4 <HTML>
 5  <HEAD>
 6 <title>测试列表选择项 </title>
 7  <script>
 8  function butSelect(){
 9    var selVal = document.getElementById("sel").value;
10    if(selVal == "1"){
11      document.getElementById("td").innerHTML = '<input type="button" value="按钮1" onclick="btnc1();">';
12    }else if(selVal == "2"){
13      document.getElementById("td").innerHTML = '<input type="button" value="按钮2" onclick="btnc2();">';
14    }else{
15      document.getElementById("td").innerHTML = '';
16    }
17  }
18  function btnc1(){
19    alert("单击了按钮1");
20  }
21 
22  function btnc2(){
23    alert("单击了按钮2");
24  }
25  </script>
26  </HEAD>
27  <BODY>
28   <table>
29   <tr>
30 <td>
31   <select onChange="butSelect();" id="sel">
32     <option value="" >
33 <option value="1">but1
34 <option value="2">but2
35   </select>
36 </td>
37 <td id="td"></td>
38   </tr>
39   </table>
40  </BODY>
41 </HTML>

posted on 2017-02-28 00:04 Sharpest 阅读(206) 评论(0) 收藏举报