Question

我是新手，想了解一下提交按钮。我正在做一个非常小的计划。您可以编写一些名称，然后我想保存它们的值并在我的Javascript代码中使用它们。

我真正想要的是调用所有文本框，以便我可以在我的Javascript中使用值（名称）。

    <form name="input" action="#" method="post">
    <table>
        <tr>
            <td>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
                <input type="text" name="txt" value="Insert name"><br/>
            </td>
    </tr>
</table>

    <input type='submit' >

编辑：接下来的问题是如何创建一个运行javascript的按钮？当用户完成类型名称时，他可以按下按钮，然后javascript会运行并在输入数组中堆叠'txt'值吗？我知道如何制作javascript，但按钮是问题所在。我该怎么做？

Answer 1

如果您想获得所有input值，则html

会有一些变化

<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="text" name="txt" value="Insert name"><br/>
<input type="button" value="Calculate" onclick="Calculate()" />

然后你可以像这样使用javascript

function Calculate(){
    var inputs = document.getElementsByName("txt");
    for(i=0; i<inputs.length; i++)
    {
       alert(inputs[i].value);
    }
}

getElementsByName() Reference

使用jquery

function Calculate(){  
    $("input[name=txt]").each(function(){
         alert($(this).val());
    });
}

Answer 2

更好地使用jquery来检索更简单，更简单的值。 http://api.jquery.com/attribute-equals-selector/

<form name="input" action="#" method="post">
<table>
    <tr>
        <td>
            <input type="text" name="1" value="Insert name"><br/>
            <input type="text" name="2" value="Insert name"><br/>
            <input type="text" name="3" value="Insert name"><br/>
            <input type="text" name="4" value="Insert name"><br/>
            <input type="text" name="5" value="Insert name"><br/>
            <input type="text" name="6" value="Insert name"><br/>
            <input type="text" name="7" value="Insert name"><br/>
            <input type="text" name="8" value="Insert name"><br/>
            <input type="text" name="9" value="Insert name"><br/>
            <input type="text" name="10" value="Insert name"><br/>
        </td>
</tr>

<input type='submit' >

<script>
 var one = $('input[name=1]').val();
 var two = $('input[name=2]').val();
 var three= $('input[name=3]').val();
 var four = $('input[name=4]').val();
 ..
 //use one,two,three according to your wish
</script>

甚至更简单（将name=1,2..更改为name=txt）：

$('input[name=txt]').each(function() {
  alert($(this).val());
});

$('input[name=txt]')＆lt; - 此部分将成为所有输入的值数组。 each会迭代它们。

编辑：你的按钮应该是这样的：

<input type="button" id="submitme" value="Submit"/>

你会像这样调用你的js函数：

$('#submitme').click(function(){
   $('input[name=txt]').each(function() {
     alert($(this).val());
   });      
});

顺便说一句：我只是假设你不想先提交表单，而只是将值放到数组中。

Answer 3

你可以使用JQuery。

喜欢这个

 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>
 <input type="text" name="txt" value="Insert name"><br/>

代码：

 $('input[name="txt"]').each(function(index, element) {
       alert(element.value);         
 });

基本提交按钮 - 保存文本

3 个答案: