前端常用功能

 

1、选择框 绑定事件，将所选择的值传给js脚本

<td  id="TheadOdds0">

         <select onchange="SelectCompany(this.options[this.selectedIndex].value);"  id="oddsSelect"  name="oddsSelect"> 

                     <option value=o_0>平均欧赔</option>

                     <option value=o_9>威廉欧赔</option>

         </select>

</td>

2、javascript 异步请求函数

 

<script>
        var xmlHttp ;
        function createXMLHttp(){
            if(window.XMLHttpRequest){
                xmlHttp = new XMLHttpRequest() ;
            } else {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
            }
        }

        function checkUseridCallback(){
            if(xmlHttp.readyState == 4){
                if(xmlHttp.status == 200){
                    var text = xmlHttp.responseText ; //接收返回的内容
                    
                    //获取从服务器端传过来的json数据，并使用JSON的parseJSON函数将文本转换为javascript对象  
                        var myobj = xmlhttp.responseText.parseJSON();   
                        //遍历javascript对象  
                        for (i = 0; i < myobj.programmers.length; i++) {   
                                alert(myobj.programmers[i].lastName);  
                            }   
                    if(text == "true"){    // 用户id已经存在了
                        document.getElementById("msg").innerHTML = "用户ID重复，无法使用！" ;
                        flag = false ;
                    } else {
                        document.getElementById("msg").innerHTML = "此用户ID可以注册！" ;
                        alert(text);
                        flag = true ;
                    }
                }
            }
        }

  //获取数据
  var jhdatas=hot3.getDataAtCol(1);  //设置需要传递的参数
  var datedatas=hot3.getDataAtCol(2); 

//异步请求
createXMLHttp() ;
xmlHttp.open("POST","/mvcstudy/MainServlet",true) ; //http://127.0.0.1:8080/mvcstudy/excel5.html
            xmlHttp.onreadystatechange = checkUseridCallback ;
            xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //send函数有参数时，这个函数必须要调用
            xmlHttp.send("wellname="+jhdatas+"&datedata="+datedatas) ;  //传递参数
            document.getElementById("msg").innerHTML = "正在验证..." ;
        }

</script>

 3、angularJs异步请求

 <div ng-app="realApp" ng-controller="realCtrl">
 <table width="99%" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#CECECE" onmouseover="changeto()" onmouseout="changeback()">
                                    <tr>
                                        <td width="6%" height="26" background="images/tab_14.gif" class="STYLE1"><div align="center" class="STYLE2 STYLE1">选择</div></td>
                                        <td width="8%" height="18" background="images/tab_14.gif" class="STYLE1"><div align="center" class="STYLE2 STYLE1">序号</div></td>
                                    </tr>
                                    <tr ng-repeat="x in names">
                                        <td height="18" bgcolor="#FFFFFF">
                                            <div align="center" class="STYLE1">
                                                <input name="checkbox" type="checkbox" class="STYLE2" value="checkbox" />
                                            </div>
                                        </td>
                                        <td height="18" bgcolor="#FFFFFF" class="STYLE2"><div align="center" class="STYLE2 STYLE1">{{x.ID}}</div></td>

 </table>
 </div>

<script>
　　var app = angular.module('realApp', []);
　　app.controller('realCtrl', function ($scope,$http) {
　　　　　　$http({
　　　　　　　　　　method: 'GET',
　　　　　　　　　　url:'../../登陆/realApp.ashx'
　　　　　　}).then(function successCallback(response) {
　　　　　　　　　　$scope.names = response.data;
　　　　　　}, function errorCallback(response) {
　　　　　　// 请求失败执行代码
　　　　　　});

　　});

</script>