如何创建表单输入框的ID [英] How to create id of input box of form
问题描述
我有这张表格.
<table><tr><td>
<FORM>
<label> ID </label></td>
<td>
<input type=text id="inputp1_id" size=24 class="text">
</td></tr>
<tr><td>
<label>Type</label></td><td><select id="inputp1_type" name="inputp1_type"><option value="text">Text</option><option value="integer">Integer</option><option value="float">Float</option><option value="list_values">List of values</option>
<option value="range">Range</option><option value="selection_collapsed">Selection (collapsed)</option><option value="selection_expanded">Selection (expanded)</option><option value="subimage">Subimage selection</option>
<option value="polygon">Polygon selection</option><option value="horizontal_separator">Horizontal separator</option></select>
</td></tr>
<tr><td> <label > Description</label></td> <td><input type=text id="inputpi_description" size=24 class="text"> </td><!--style=" width:300px; height:20px;"-->
</tr>
<tr><td> <label>Value</label></td><td> <input type="text" name="inputp1_value" id="inputp1_value" class="text" size=24></td></tr>
<tr><td> <label > Info (help)</label></td><td>
<input type=text id="input1_value" size=24 class="text"></td></tr>
<tr><td><label > Visible?</label></td><td><input type="checkbox" name="inputp1_visible" id="inputp1_visible"></td></tr></table>
<!--</form>--></div>
但是(可以吗?)可以创建ID的输入框吗? 因为这些变量是编号的". 例如,表格中的第一个id是inputp1_id,但我想使用的数字是可变的. 是否可以使用Javascript或Jquery创建ID?
But (it's possible?) can create the id's input box? Because the variable these are "numbered". For example the first id in the form is inputp1_id but the number i want use how variable. It's possible create the id with the Javascript o Jquery?
l=3
Id='inputp' +l+'_id'
创建后,输入文本具有id=inputp3_id
After this create the input text has the id=inputp3_id
推荐答案
这里是一个有关如何使用jquery和javascript动态生成html内容的示例.两种方法虽然看起来很相似,但结果却有些不同:jquery
会生成一个附加的<tbody>
标记,而javascript
会将新行直接插入到<table>
中.我建议您通过按 Ctrl + Shift + I 在Firefox的DOM Inspector
中检查结果. IT是非常方便和有效的工具.这是算法算法:
Here is one example on how to generate html contents dynamically with jquery and javascript. Both methods, although they look similar, give a bit different results: jquery
generates one additional <tbody>
tag, while javascript
inserts the new rows directly to <table>
. I recommend you to inspect the result in the Firefox's DOM Inspector
by pressing Ctrl+Shift+I. IT's very handy and effective tool. And here is the algorythm:
var i=0; // this is simple counter
function generate_row_dynamically_in_jquery() {
i++;
var new_row = $('<tr/>');
var new_cell1 = $('<td>ID <input type="text" name="inputp'+i+'_id" id="inputp'+i+'_id" size="24" class="text"/></td>');
var new_cell2 = $('<td>Visible? <input type="checkbox" name="inputp'+i+'_visible" id="inputp'+i+'_visible"> </td>');
new_row.append(new_cell1).append(new_cell2);
$('#table1').append(new_row);
}
function generate_row_dynamically_in_javascript() {
i++;
var new_row = document.createElement('tr');
var new_cell1 = document.createElement('td');
new_cell1.innerHTML = 'ID <input type="text" name="inputp'+i+'_id" id="inputp'+i+'_id" size="24" class="text"/>';
var new_cell2 = document.createElement('td');
new_cell2.innerHTML = ' Visible? <input type="checkbox" name="inputp'+i+'_visible" id="inputp'+i+'_visible">';
new_row.appendChild(new_cell1);
new_row.appendChild(new_cell2);
document.getElementById('table1').appendChild(new_row);
}
& @ jsfiddle
这篇关于如何创建表单输入框的ID的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!