初级Ajax使用

最新推荐文章于 2022-08-15 19:17:16 发布

dengminhui

最新推荐文章于 2022-08-15 19:17:16 发布

阅读量75

点赞数

分类专栏：前端学习文章标签： Ajax Safari Firefox Opera JavaScript ViewUI

前端学习专栏收录该内容

14 篇文章 1 订阅

订阅专栏

首先建立一个Javascript文件如下

function ajaxFunction(url,callback)   
{   
var xmlHttp;   
try  
  {   
  // Firefox, Opera 8.0+, Safari   
  xmlHttp=new XMLHttpRequest();   
  }   
catch (e)   
  {   
  // Internet Explorer   
  try  
    {   
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");   
    }   
  catch (e)   
    {   
    try  
      {   
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");   
      }   
    catch (e)   
      {   
      alert("Your browser does not support AJAX!");   
      return false;   
      }   
    }   
  }   
  xmlHttp.onreadystatechange=function()   
    {   
    if(xmlHttp.readyState==4)   
      {   
        return callback(xmlHttp.responseText);   
      }   
    }   
  xmlHttp.open("GET",url,true);   
  xmlHttp.send(null);   
  }

然后在实际使用文件头部中针对返回的message做处理

 //Ajax回调函数，返回查询出的字符串
function callback(message) {
	var content = document.getElementById("userSelect");
	content.outerHTML = '<select style="width:200px;"  id="userSelect" size=10  multiple="multiple" name="userSelect" οndblclick="addUserSelect(userSelect,userList,userIdList)">'+message+'</select>';
    
}

实际使用文件内，注意ajaxFunction的两个参数，第一个为请求的地址，第二个为callback函数名

<select  style="width:200px;" id="departSelect" size=10 multiple="multiple" name="departSelect" οndblclick="ajaxFunction('selectUserByDepart.do?departName='+this.value,callback);">
     		       #foreach($depart in $departMap.values() )   
		           <option value=$depart>$depart</option>
		           #end
              </select>