如何在div元素上調用方法時創建具有動態使用的id的div元素？

Question

首先，我是JavaScript新手。 我正在使用aloha編輯器。 我想通過為每個div分配id來動態地使用div標簽創建文本區域。 使用該id我必須調用一個方法，這是一個aloha方法。 一切都很順利，但aloha方法沒有獲得id。 在瀏覽器上我得到一個空的空間而不是一個aloha盒子。

這是我的代碼..

JavaScript的

     var screen=document.getElementById('addScreens');
     num_q=document.getElementById('numquest').value;

     for(i=0;i<num_q;i++) {   
         div1=document.createElement("div");
         div1.id="multicolumn";
         screen.appendChild(div1);
     }

     //aloha
     $(document).ready(function() {
         $('#multicolumn').aloha(); //multicolumn is not defined
     });

**HTML**

<html>
<body>
 <br><input type="text" name = "numquest" id ="numquest" value="" size="5" style="" disabled>
     <input type="button" value="submit" onclick="getFields();">
<div id="addScreens"> <br> </div>
</body>
</html>

<style type="text/css">

            #multicolumn {

                -webkit-column-width:300px;
                -webkit-column-gap:30px;
                -moz-column-width:300px;
                -moz-column-gap:30px;
                column-width:100px;
                column-gap:30px;
                      width:550px;
                height: 150px;
                margin: 0 auto;
                      overflow-x: auto;
                      overflow-y: auto;
                   }

            </style>

那么，我如何將動態創建的div的id隨處可訪？ 提前感謝任何想法。

Answer 1

您可以在$ document中創建div，然后在其上調用aloha。 請參閱以下代碼以了解動態ID生成

 //aloha
    $(document).ready(function() {
         var screen=document.getElementById('addScreens');
         var num_q=document.getElementById('numquest').value;
         for(i=0;i<num_q;i++)
         {   
            var div1=document.createElement("div");
            div1.id = "multicolumn_" + i;
            screen.appendChild(div1);
            $('#' + div1.id).aloha(); 
         }
         //multicolumn is not defined
    });

Answer 2

從您共享的代碼中，根本不會創建多列div，因為輸入字段的值永遠不會設置為數值。 在代碼中考慮這一行

<input type="text" name = "numquest" id ="numquest" value="" size="5" style="" disabled>

並在JS中調用此行

num_q=document.getElementById('numquest').value;

將導致num_q計算為空字符串。 因此你的循環不會有任何影響。 您可以嘗試為輸入提供默認值，並使用以下內容稍微訪問其值：

<input type="text" name = "numquest" id ="numquest" value="1" size="5" style="" disabled>
//JS
num_q= parseInt(document.getElementById('numquest').value, 10);

最重要的是，我必須同意Saravana，將一切都放在$(document).ready函數中是一種更好的方法。

如何在div元素上調用方法時創建具有動態使用的id的div元素？

問題描述

2 個解決方案

解決方案1
1 已采納 2013-12-05 05:55:27

解決方案2
1 2013-12-05 06:03:08

如何在div元素上調用方法時創建具有動態使用的id的div元素？

問題描述

2 個解決方案

解決方案1 1 已采納 2013-12-05 05:55:27

解決方案2 1 2013-12-05 06:03:08

解決方案1
1 已采納 2013-12-05 05:55:27

解決方案2
1 2013-12-05 06:03:08