1 $(function(){ 2 queryTemplateSort(); 3 // 4 fillAddTemplatePage(); 5 function queryTemplateSort() { 6 $.ajax({ 7 type: "post", 8 url: "http://localhost:8080/...", 9 data: {"pageNo": 1, "pageSize": 20}, 10 dataType: "json", 11 success:function(data){ 12 var sortArray = data.dataList; 13 for(var i = 0; i < sortArray.length; i++) { 14 var option = "<option value='"+ sortArray[i].id +"'>"+ sortArray[i].name +"</option>"; 15 var $selectElement = $(".templateSelectDiv select"); 16 $selectElement.append(option); 17 } 18 } 19 }); 20 } 21 fillAddTemplatePage(); 22 function fillAddTemplatePage() { 23 var varUrl = window.location.search; 24 if(varUrl === "") { 25 return; 26 } 27 var topicid = "" + parseToNum(varUrl); 28 var jsonObject = {"topicid": topicid}; 29 var jsonStr = JSON.stringify(jsonObject); 30 $.ajax({ 31 type: "post", 32 url: "http://localhost:8080/....", 33 data: {'params':jsonStr}, 34 dataType: "json", 35 success: function(data){ 36 fillData(data.obj); 37 } 38 }); 39} 40 /**填充頁面數據*/ 41 function fillData(data) { 42 document.getElementById("magazineTopicId").value = data.id; 43 $(".templateSelectDiv select option[value='" + data.categoryId + "']")[0].selected = true; //erro undefined 44 document.getElementById("title").value = data.varName; 45 document.getElementById("chooseMusic").value = data.music.name; 46 document.getElementById("musicLink").value = data.music.link; 47 fillPage(data); 48} 49 ..... 50}
1 //jsp 2 <div class="templateSelectDiv"> 3 <select > 4 <option value="0">所有</option> 5 </select> 6 </div>
加載這個jsp的時候調用queryTemplateSort方法,其中用ajax請求到數據後把選項拼接到這個select框中,第24行若是請求的url沒有帶參數則不填充頁面數據,若是帶了參數就根據一個id去查詢這個頁面的數據,而後回寫到頁面,可是由於在調用queryTemplateSort方法,ajax請求沒有設置async屬性,默認爲true,支持異步,就是執行queryTemplateSort方法的同時分出一個線程繼續向下執行fillAddTemplatePage方法,而這個方法的選擇器選中的元素是queryTemplateSort執行完畢後才添加上去的,因此當若是queryTemplateSort沒執行完就執行fillAddTemplatePage,下面這個語句就會報undefined的錯誤。當設置async: false時(意思是不分出另外的線程,執行完該方法後纔會繼續執行其餘代碼),這個時候當再執行到fillAddTemplatePage時,queryTemplateSort已經執行成功,這時就不會報錯。ajax
$(".templateSelectDiv select option[value='" + data.categoryId + "']")[0].selected = true;
後來發現就算取消了異步請求這樣選中下拉框的選項仍是會出現undefined的錯誤,而下拉框已經加載完成,不得要領,後來無賴改爲
$(".templateSelectDiv select").val(data.categoryId)來選中下拉框。