是否可以获得具有相同名称的文本框的所有值?

时间:2011-09-29 12:08:31

标签: javascript html

我对javascript有疑问。获取具有相同名称的文本框的值是否可行?

例如

<INPUT TYPE="text" NAME="inputbox" VALUE="">
<INPUT TYPE="text" NAME="inputbox" VALUE="">

这些文本框具有相同的名称,如何通过名称获取其值?

好的,lemme解决了我遇到的真正问题,希望我能正确解释。

我有一系列文本框,我现在必须验证。通常验证textboxe并不是什么大不了的事。

但是这是一个文本框数组,只有在通过单击+按钮动态添加字段时,文本框的ID才可用。单击按下按钮时,将显示整组文本框。点击它的次数会增加。

因此,使用ID验证值是不可能的,所以我尝试了名字。

JAVASCRIPT FUNCTION

function insComep()
    {

    // $("#doctorPri").validationEngine("updatePromptsPosition")  
// jQuery("#doctorPri").validationEngine('attach', {promptPosition : "topRight"});

        rl=document.getElementById("compeTable").rows.length;
        var a=document.getElementById("compeTable").insertRow(rl);

        var g=a.insertCell(0);
        var f=a.insertCell(1);  
        var m=a.insertCell(2);  
        var n=a.insertCell(3);  
        var o=a.insertCell(4);  
        var p=a.insertCell(5);
        var q=a.insertCell(6);
        var r=a.insertCell(7);
        var s=a.insertCell(8);
        var t=a.insertCell(9);
        //var v=a.insertCel1l(11);
        //var u=a.insertCell(12);
g.innerHTML='<select name="competproduct[]" style="width:86px" id="competproduct'+rl+'" class="validate[required]" ><option value="">--Select--</option><?echo $product_str;?></select>';
f.innerHTML='<input type="text" name="competcompany[]" id="competcompany'+rl+'" size="10" class="validate[required]" >';
m.innerHTML='<input type="text" name="competbrand[]" id="competbrand'+rl+'" size="10" class="validate[required]" >';
n.innerHTML='<input type="text" name="competdrug[]" id="competdrug'+rl+'" size="10" class="validate[required]" >';
o.innerHTML='<input type="text" name="competquty[]" id="competquty'+rl+'" size="2" class="validate[required,custom[integer]] text-input" >';
p.innerHTML='<input type="text" name="competprice_frm[]" id="competprice_frm'+rl+'" size="2" class="validate[required,custom[number],funcCall[getPriceFromE]] text-input" />';
q.innerHTML='<input type="text" name="competprice_to[]" id="competprice_to'+rl+'" size="2" class="validate[required,custom[number],funcCall[getPriceTo]] text-input" />';
r.innerHTML='<input type="text" name="competmrp[]" id="competmrp'+rl+'" size="2" class="validate[required,custom[number],funcCall[getMrp]] text-input"/>';
s.innerHTML='<select name="ChemistParma[]" style="width:86px" id="ChemistParma'+rl+'" style="width:86px" ><option value="">--Select--</option><?echo $chemist_str;?></select>'; 
t.innerHTML='<img src="media/images/details_close.png" onClick="delCompe('+rl+'); "/>';
// jQuery("#doctorPri").validationEngine('attach', {promptPosition : "topRight"});


     $("#doctorPri").validationEngine('hideAll');
    }

HTML

<table width="100%" id='compeTable' border='0' style='margin-left:auto;margin-right:auto;margin-top:40px;' >


<tr style="border-bottom:1px solid #999999;"><td colspan='4'>
<div style="background:;padding:3px;text-align:left; ">
    <font color='black'><strong  >Competitor Detail(s):</strong></font><font color="red">*</font>
</div>

</td></tr>



        <tr>
        <td>Product Name:<font color="red">*</font></td>
<td>Company Name:<font color="red">*</font></td>
<td>Brand Name:<font color="red">*</font></td>
<td>Drug Name:<font color="red">*</font></td> 
<td> Quantity:<font color="red">*</font></td>
<td>Pricefrom Dist:<font color="red">*</font></td>
<td   >Price to Dist:<font color="red">*</font></td>
<td> MRP:<font color="red">*</font></td>
<td>Chemist<font color="red">*</font><input type='button'value='+' style='width:1px' style='width:1px'  onclick='frame5()'/> 
</td>
<td></td>
</tr>
<tr><td>&nbsp;</td></tr>


            <tr>


                    <td>
                    <select name='competproduct[]' id='competproduct' style="width:86px" class="validate[required]" >
                    <option value=''>-select Product-</option>
                    <? echo $product_str;?>

                    </select>
                </td>

                <td>
                    <input type="text" name="competcompany[]"  id="competcompany" size="10" class="validate[required]" >
                </td>
                <td   ><input type="text" name="competbrand[]" id="competbrand" size="10" class="validate[required]" >
                </td>
                <td><input type="text" name="competdrug[]" id="competdrug" size="10" class="validate[required]" >
                </td>
                <td><input type="text" name="competquty[]"  id="competquty" size="2" class="validate[required,custom[integer]] text-input" >
                </td>
                <td>
<input type="text" name="competprice_frm[]" id="competprice_frm" size="2" class="validate[required,custom[number],funcCall[getPriceFromE]] text-input" />

                </td>
                <td>
                <input type="text" name="competprice_to[]" id="competprice_to" size="2" class="validate[required,custom[number],funcCall[getPriceTo]] text-input" />
                </td>
                <td><input type="text" name="competmrp[]" id="competmrp" size="2" class="validate[required,custom[number],funcCall[getMrp]] text-input" onBlur=''/>
                </td>
<td>
<select name='ChemistParma[]' id='ChemistParma'  style="width:86px">
<option value=''>-select chemict-</option>
<?echo $chemist_str?>
</select></td>
<td>
<img src="media/images/details_open.png" onClick="insComep()"/>
</td>

                </tr>
        </table>

3 个答案:

答案 0 :(得分:3)

这很简单,

document.getElementsByName("inputBox");

答案 1 :(得分:2)

您可以使用多种不同的方法。

1)手动遍历childNodes等,并检查nodeName。这很复杂,需要很多无聊的代码,所以我不会在这里写一个例子。

2)document.getElementsByTagName。这也可以在DOM节点上使用,因此您可以执行document.getElementById("my_form").getElementsByTagName("input")之类的操作,具体取决于DOM的其余部分。

3)document.querySelectorAll("input")。字符串参数是一个完整的CSS选择器。但是一些旧的浏览器不支持这一点。

答案 2 :(得分:1)

以下是您的代码示例:

<div id="inputs">
    <INPUT TYPE="text" NAME="inputbox" VALUE="asd">
    <INPUT TYPE="text" NAME="inputbox" VALUE="efs">
</div>

<script>
    $(document).ready(function () {  
        var howmany = $('#inputs').children("input").length;
        alert(howmany);

        for( i=0; i<= howmany-1; i++ ) {
            var input = $("#inputs").children("input").eq(i).attr('VALUE');
            alert(input);
        }
    });
</script>