Ajax/Javascript動態創建按鈕的問題

這是一個JavaScript函數，我必須根據onload期間文本文件中的內容動態創建按鈕。雖然它能夠讀取文件，但我使用警報消息來檢查var按鈕是否正確，但似乎無法創建按鈕。Ajax/Javascript動態創建按鈕的問題

function createButtons(){ 
    $(document).ready(function() { 
     alert("1"); 
     $.ajax({ 
     url : 'http://localhost:8080/SSAD/type.txt', 
     dataType : "text", 
     success : function (filecontent) { 
      var lines=filecontent.split('\n'); 
      $.each(lines, function() { 
      if (this!='') { 
       var button='<button type="button" class="btn btn-block btn-inverse active" data-toggle="button tooltip" title="Click this to enable/disable viewing of'+this+'" onclick="toggleVisibility('+"'"+this+"'"+')">'+this+'</button>'; 
       $("#crisisButtons").append(button); 
      } 
      }); 
     } 
     }); 
    }); 
}

HTML：

<div class="crisisButtons"></div> 

<script type="text/javascript">window.onload = createButtons();</script>

來源

2013-04-01 U.f.O

你確定了'成功'功能火災？ –

很確定它確實如我在if循環中添加了一個警告（this），它顯示了文本文件中的內容。 –

你沒有指定一個事件處理程序，您調用它。函數createButtons馬上被調用，並且它返回的任何東西都被賦值給window.onload。

window.onload = createButtons();

必須

window.onload = createButtons;

你真正應該使用是addEventListener

你必須是你正在使用domready中和的onload另一個問題。兩個不同的事件做不同的事情！挑一個，不要同時使用。

更改您的代碼，所以它只是

$(function() { 
    alert("1"); 
    $.ajax({ 
    url : 'http://localhost:8080/SSAD/type.txt', 
    dataType : "text", 
    success : function (filecontent) { 
     var lines=filecontent.split('\n'); 
     $.each(lines, function() { 
     if (this!='') { 
      var button='<button type="button" class="btn btn-block btn-inverse active" data-toggle="button tooltip" title="Click this to enable/disable viewing of'+this+'" onclick="toggleVisibility('+"'"+this+"'"+')">'+this+'</button>'; 
      $("#crisisButtons").append(button); 
     } 
     }); 
    } 
    }); 
});

，並使用錯誤處理程序上Ajax調用，以確保不被觸發。

編輯

爲什麼什麼也不顯示

$("#crisisButtons").append(button); <-- ID selector 
<div class="crisisButtons"></div> <-- class name

所以id選擇更改爲一類，你會得到

$(function() { 
    alert("1"); 
    $.ajax({ 
    url : 'http://localhost:8080/SSAD/type.txt', 
    dataType : "text", 
    success : function (filecontent) { 
     var lines=filecontent.split('\n'); 
     $.each(lines, function() { 
     if (this!='') { 
      var button='<button type="button" class="btn btn-block btn-inverse active" data-toggle="button tooltip" title="Click this to enable/disable viewing of'+this+'" onclick="toggleVisibility('+"'"+this+"'"+')">'+this+'</button>'; 
      $(".crisisButtons").append(button); 
     } 
     }); 
    } 
    }); 
});

來源

2013-04-01 14:53:17 epascarello

如何將window.onload = createButtons;在你所建議的代碼上工作？或者我想爲代碼創建一個事件監聽器？ –

如果您使用DOM就緒代碼，則不需要onload。最後一個代碼塊本身應該沒問題。 – epascarello

我已經嘗試過，但不知何故我的按鈕仍然不顯示。它也沒有顯示我使用的警報消息。 –

Ajax/Javascript動態創建按鈕的問題

回答

相關問題