ajax動態為a標簽href賦值不執行跳轉的原因分析及解決

2024-09-01 08:29:04

字體：大中小

來源：轉載

供稿：網友

由于一中考評系統要加入一個新的功能“調查問卷”，我想沿用別人做好的調查問卷，用別人的有一個好處就是：人家做的專業，界面美化等非常人性化，但是它需要你每次設置完調查問卷后發布一下網址，客戶端訪問的每次都是變動的地址。

客戶端每次點擊“調查問卷”，就會跳轉到相應頁面：

點擊“調查問卷”即進入調查問卷頁面：

我使用a 標簽，每次訪問管理員提交的“調查問卷”
代碼如下:
<li><a href="" onclick="meizz(this)">調查問卷</a></li>

點擊“調查問卷”，調用meizz函數，該函數通過ajax調用返回要訪問的“調查問卷”網址：
代碼如下:
<script type="text/javascript" language="javascript">
function meizz(e) {
$.ajax({
//async:false, //設置ajax的同步
type: "get", //get方式
url: "../handler/QueryQuestionnaire.ashx",
//返回數據成功，將返回的json數據解析，顯示在課程信息列表中
success: function (strJson) {
//檢查后臺返回的數據
var dataArray = eval(strJson);
e.href = dataArray[0].Questionnaire;//要訪問的網址
},
//返回數據失敗，彈出錯誤顯示
error: function (XmlHttpRequest, textStatus, errorThrown) {
alert(XmlHttpRequest.responseText);
}
});
}
</script>

現象是 e.href如果放在函數的$.ajax之上可以運行，但是放到ajax里面綁定動態返回的地址，就不能運行了。經過了郁悶，最終找到了答案：因為ajax默認調用是異步的，所以不等ajax調用處理回調函數為href賦值，就直接發起了href,在這里這時候href是空值。

解決方法：將ajax調用方法改為同步，聲明ajax調用方式為同步：
代碼如下:
$.ajax({
async:false, //設置ajax的同步
}

這樣href的執行就必須等待function中ajax調用完成后才會觸發，就得到了想要的結果。

上一篇：用juery的ajax方法調用aspx.cs頁面中的webmethod方法示例

下一篇：Ajax 說的比較清楚的一篇文章