如何组合javascript的两个不同功能

您好,我是一个新手,在编写的HTML和Java代码,谁能帮我弄明白如何结合这个js代码

选择 | 换行 | 行号
  1. var data = [{dept: 'Marketing', user: []},{dept: 'IT', user: []},{dept: 'Accounting', user: []}];
  2.         function initCombo(){
  3.             var opt1 = document.getElementById('opt1');
  4.             var opt2 = document.getElementById('opt2');
  5.             for(var i=0;i<data.length;i++){
  6.                 //alert(data[i].dept);
  7.                 var option = document.createElement('option');
  8.                 option.value = i;
  9.                 option.text = data[i].dept;
  10.                 opt1.add(option);    
  11.             }
  12.             for(var i=0;i<data.length;i++){
  13.                 //alert(data[i].dept);
  14.                 var option = document.createElement('option');
  15.                 option.value = i;
  16.                 option.text = data[i].dept;
  17.                 opt2.add(option);    
  18.             }
  19.         }
  20.         function save(){
  21.             var  input = document.getElementById('input');
  22.             if (input.value != ''){
  23.                 var opt1 = document.getElementById('opt1').value;
  24.                 data[opt1].user[data[opt1].user.length] = input.value;
  25.  
  26.                 reloadOpt2();
  27.             }else{
  28.                 alert('ISI KAN DATA COI');
  29.             }
  30.             input.focus();
  31.             input.value='';
  32.         }
  33.  
  34.         function reloadOpt2(){
  35.             var opt2 = document.getElementById('opt2').value;
  36.             var optUser = document.getElementById('optUser');
  37.             var length = optUser.options.length ;
  38.  
  39.  
  40.             while(optUser.options.length != 0){
  41.                 optUser.removeChild(optUser.options[0]);
  42.             }
  43.  
  44.             for (var i=0; i<data[opt2].user.length; i++){
  45.                 var option = document.createElement('option');
  46.                 option.value = i;
  47.                 option.text = data[opt2].user[i];
  48.                 optUser.add(option);    
  49.             }
  50.         }

超文本标记语言

选择 | 换行 | 行号
  1. <body onload='initCombo()'>
  2.  
  3. <select id="opt1">
  4. </select>
  5. <br/>
  6.  
  7. <input type='text' id='input' value=''/>
  8. <br/>
  9.  
  10. <input type='submit' value='Simpan' onclick='save()'/>
  11. <br/>
  12.  
  13. <select id="opt2" onchange='reloadOpt2()'>
  14. </select>
  15.  
  16.  
  17.  
  18. <select id="optUser">
  19. </select>

到我的一个HTML,它正在使用Java脚本更改表格内容
以下是js代码

选择 | 换行 | 行号
  1. function myFunction() {
  2.     var x = document.getElementById("mySelect").value;
  3.     document.getElementById("demo1").innerHTML = "title";
  4.     document.getElementById("demo2").innerHTML = "test";
  5.     document.getElementById("demo3").innerHTML = "test";
  6.     document.getElementById("demo4").innerHTML = "test";    
  7.     }
  8.  
  9. function myFunction1(){
  10.     var x = document.getElementById("mySelect").value;
  11.     document.getElementById("demo1").innerHTML = "title";
  12.     document.getElementById("demo2").innerHTML = "using js DOM";
  13.     document.getElementById("demo3").innerHTML = "test";
  14.     document.getElementById("demo4").innerHTML = "copyright@test";
  15.     }

和Html代码

选择 | 换行 | 行号
  1. <button id="mySelect" onclick="myFunction1()">Home</button>
  2.     <button onclick="()">Login</button>
  3.     <button id="mySelect" onclick="myFunction()">About</button>
  4.  
  5. -----------
  6. <p align="center" id="demo1"></p></h1></center>
  7.     <p align="left" id="demo2"></p>
  8.     <p align="left" id="demo3"></p>
  9.     <p align="left" id="demo4"></p>

我想要的只是当我点击Login按钮时,它会显示第一个javascript中的组合框
**为我糟糕的英语道歉**

标签: Javascript

添加新评论