1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <title></title>
7 <link rel="stylesheet" href="">
8 </head>
9 <body>
10 <form action="">
11 <p>
12 <label for="backgroundColor">选择背景色:</label>
13 <select id="backgroundColor">
14 <option value="white" selected="selected">White</option>
15 <option value="black">Black</option>
16 </select>
17 </p>
26
27 <p>
28 <input type="button" id="previewButton" value="Preview">
29 </p>
30 </form>
31
32 <script>
33 var bgColor = document.getElementById('backgroundColor');
34 var preview = document.getElementById('previewButton');
35
36 var index = bgColor.selectedIndex;
37 var value = bgColor[index].value;
38
39 preview.addEventListener('click',function(){
40 console.log(index); //0
41 console.log(value); //white
42 })
43
44 </script>
45 </body>
46 </html>
