循環和顯示JavaScript數組的內容，從HTML數據屬性

我有被傳遞雖然HTML數據元素的數組循環和顯示JavaScript數組的內容，從HTML數據屬性

<button type="button" class="open-my-modal btn btn-primary" 
data-number="'.htmlspecialchars(json_encode($myArray), ENT_QUOTES, 'UTF-8')

數組中存放一組有這樣

的格式不同的陣列的

Array(
    [0] => ABC 
    [1] => DEF 
    [2] => GHI 
    [3] => JKL 
) 
Array(
[0] => MNO 
[1] => 123A 
[2] => 123B 
[3] => 123C 
) 
Array(
[0] => orange 
[1] => yellow 
[2] => green 
[3] => blue 
)

的數據被傳遞到像場ID的模態如下所示

<tr> 
    <td><span id ="exampleone"></span></td> 
    <td><span id ="exampletwo"></span></td> 
    <td><span id ="examplethree"></span></td> 
    <td><span id ="examplefour"></span></td> 
</tr>

和腳本的鏈接ID和數據

<script> 

$(document).ready(function() {    
$(".open-my-modal").click(function(){ 
    $("#exampleone").html($(this).data("number")[0]);

這正確顯示ABC，DEF，GHI，JKL所有在屏幕上。但我想動態地做到這一點。例如

<td><span id ="exampleone"></span></td> <!-- output will be ABC--> 
<td><span id ="exampleone"></span></td><!-- output will be DEF--> 
etc, etc

我拉動我的數據動態，所以每個數組可能有超過4個條目，它會不時地變化。

我被困在那裏我需要得到數字（數據）以及如何生成和ID的長度爲它動態

(<td><span id ="dynamically generated">)

，然後如何動態地用正確的

鏈接ID

data($("#number").html($(this).data("number"));)

來源

2017-07-26 jumpman8947

你的問題不清楚，有點混亂。 – William

我試圖通過我的數組動態循環，並在引導模式中顯示內容元素 – jumpman8947

'$（this）.data（'number'）.length'將返回數組中元素的數量。 – Taplar

要生成清單中的項目動態，你可以使用下面的代碼

HTML（更換您的代碼）

<tr id="parentNode"></tr>

的JavaScript（把你的jQuery代碼中）

$.each($(this).data('number'), function(index, value){ $("#parent").append($('<td>').append($('<span>', {'id' : 'example' + index , 'text' : value}))); });

這將產生<td><span id=example1>value1</span></td>等。

我強烈建議您使用AJAX從服務器獲取數據。這裏是guide

來源

2017-07-27 02:38:38 kasper

循環和顯示JavaScript數組的內容，從HTML數據屬性

回答

相關問題