如何在JavaScript中使用html循環獲取動態id的值？

我使用redips javascript創建拖放系統。如何在JavaScript中使用html循環獲取動態id的值？

這是使用HTML和PHP生成數據

<div id="base"> 
    <table> 
    <tbody> 
     <?php 
      foreach($deviceID as $row) 
      { 
      echo '<tr><td><div class="drag">'.$row['description'].'<input type="hidden" id="bus" value="'.$row['description'].'"></div></td></tr>'; 
      } 
     ?> 
     </tbody> 
    </table> 
</div>

我的腳本這是我的JavaScript文件的片段。

var redips_init; 
redips_init = function() { 
    // reference to the REDIPS.drag 
    var rd = REDIPS.drag; 
    // initialization 
    rd.init(); 
     rd.drop_option = 'shift'; 
    rd.animation_shift = true; 

     rd.myhandler_dropped = function() {    
      alert($('#bus').val()); 
     } 
};

來源

2012-04-18 jovenrp

當所有輸入都具有「總線」作爲ID時，它怎樣纔是動態的？ ID只能使用一次。 – Joseph 2012-04-18 09:17:35

由您的PHP產生的標記將是無效的，除非你只有一行（但是，爲什麼你會有一個循環）。 'id'值**必須** [頁面上唯一]（http://www.w3.org/TR/html5/global-attributes.html#the-id-attribute）。 – 2012-04-18 09:18:53

發佈的PHP代碼將導致非唯一的元素ID。根據定義，ID應該是唯一的。你需要解決這個問題。 – GordonM 2012-04-18 09:28:04

我不擅長用PHP，但我通常在JSP中做的是創建一個本地索引變量並將其追加到每個循環的ID屬性。

所以您的代碼會是這個樣子

<?php 
     $index=0;  
     foreach($deviceID as $row) 
      { 
      echo '<tr><td><div class="drag">'.$row['description'].'<input type="hidden" id="bus'.$index++.'" value="'.$row['description'].'"></div></td></tr>'; 
      } 
     ?>

在JavaScript中，你dragAndDrop事件應該返回一個索引位置由u能得到適當的值。

現在，您可以在JavaScript中使用此動態ID來執行任何您想要的操作。

來源

2012-04-18 09:30:49 Kshitij

我試過了，但問題是如何獲得該元素在JavaScript中的ID？因爲我一次只拖動一個元素，所以如何知道元素具有哪個ID？ – jovenrp 2012-04-18 09:51:57

hmmm ...不完全確定abt redips library..checkout此鏈接的第三個表格示例http://www.redips.net/javascript/drag-and-drop-table-content/。您需要查看代碼他們如何確定索引拖動事件 – Kshitij 2012-04-18 10:21:48

REDIPS.drag包含save_content()方法來掃描表中的所有元素DIV和所述結果返回作爲查詢字符串或JSON對象。輸入參數是表ID和返回結果的類型（默認爲查詢字符串）。如果這不夠好，您可以搜索save_content（）源並進行自定義。方法很簡單，它使用幾個循環來掃描表格內容。

另一方面，如果您需要知道可以寫入myhandler_dropped事件處理程序的已丟棄DIV元素的ID。這裏是代碼片段：

rd.myhandler_dropped = function() { 
    // define DIV id 
    var id = rd.obj.id; 
    // write DIV id to the console 
    console.log(id) 
};

希望此回答將有所幫助。

來源

2012-06-29 11:56:59 dbunic

嗨，感謝您的答案，但我已經解決了所有問題，我有關於redip。我是按照你編碼的方式來完成的。不管怎麼說，還是要謝謝你。酷js！這對我幫助很大！：d – jovenrp 2012-07-03 03:04:08

如何在JavaScript中使用html循環獲取動態id的值？

回答

相關問題