button標籤的onclick事件

1.普通的button標籤訂義onclick事件
    (1)：無參javascript

<button οnclick="mymethon()"></button>

<script type="text/javascript">
         function  mymethon(){
                alert("觸發點擊事件");
           }
</script>

 (2)：有參
        ①：一個參數    html

<button οnclick="mymethon('123')"></button>

 <script type="text/javascript">
           function  mymethon(num){
                  alert("單個參數:"+num);
             }
 </script>

     
        ②：多個參數，用","隔開  java

<button οnclick="mymethon('張三','男','北京市朝陽區')"></button>

<script type="text/javascript">
          function  mymethon(name,sex,address){
                alert("姓名"+name+";性別:"+sex+";住址:"+address);
             }
</script>

2.for循環給button標籤訂義onclick事件並調用
        說明：無參for循環onclick方法和普通的方法方式同樣，能夠參考案例1.(1)，在此不作過多解釋，主要是說一下追加傳參的時候，轉義符的神奇存在
        另外須要注意的是操做順序：先定義方法再調用，否則容易出現相似"未定義"的相關錯誤，根據JS代碼的執行順序，方法寫的$(document).ready(function(){});外比較合適數組

PS：在此順便說明一下js代碼的執行順序：工具

<script type="text/javascript">

        $(document).ready(function() {

            //後執行
        });

        //先執行
</script>

   (1)：一個參數
     spa

<script type="text/javascript">

        function  mlook(name){
          alert(name);
        }
        

        $(document).ready(function() {

           //數組，一下子以便循環追加時使用
                 var ckName=new Array();
                    ckName[0]="張三";
                    ckName[1]="李四";
                    ckName[2]="王五";
                    ckName[3]="張柳";
                    ckName[4]="趙六";
        
           var mDiv document.getElementById("mWindows");

        //給id爲"mWindows"的標籤(此處是div盒子)追加內容
         for (var i = 1; i < ckName.length; i++) {
             mDiv .innerHTML += '<span>'+ ckName[i]+ '</span>次'+
             //傳字符串類型的數據時須要加"引號"，"\'"是轉義符，能夠有效的轉義引號
             '<button οnclick="mlook(\''+ckName[i]+'\')">查看詳情</button>'; 
            }                       
      });
                
        
</script>

                  
    (2)：多個參數
      .net

<script type="text/javascript">

        $(document).ready(function() {
                 var ckName=new Array();
                    ckName[0]="張三";
                    ckName[1]="李四";

                 var officeName=new Array();
                    officeName[0]="李老師";
                    officeName[1]="王老師";

                 var bstartTime=new Array();
                    bstartTime[0]="2018-05-01";
                    bstartTime[1]="2018-05-31";
                    
         var mDiv= document.getElementById("mWindows");
          //給id爲"mWindows"的標籤(此處是div盒子)追加內容
           for (var i = 1; i < ckName.length; i++) {
                   mDiv.innerHTML += '<span>'+ ckName[i]+ '</span>次&nbsp;'+
                 '<button οnclick="mwant(\''+ckName[i]+'\',\''+officeName+'\',\''+bstartTime+'\')">查看詳情</button>';
            //同理：多個參數的話，用逗號隔開，注意看清楚每對符號是否齊全
                        }
           });
                


         function mwant(student,teacher,date){
                  alert(name+teacher+date);
           }

        </script>

 PS:若是有不太會使用轉義符的盆友，給大家推薦一個在線HTML代碼轉換爲JavaScript字符串工具：http://tools.jb51.net/transcoding/html2jscode

最最後：這是我本身總結的，若發現有不足或者其餘新知識點歡迎提意見和補充！htm