Question

我试图检索该tr类中的所有输入值

            <tr class="tr-shadow" id="myform">

                     <td>

                        <span class="status--process">
                        <input class="au-input au-input--sm" type="text" name="search" placeholder="Search for datas &amp; reports..." style="width: 90px;" />
                        </span>

                                </td>
                                 <td class="desc"><input class="au-input au-input--sm qty" type="text" name="search" placeholder="i.e. 20 EA" style="width: 100px;" />
                                            </td>
                                             <td class="status--process" >
                                                 <input class="au-input au-input--sm" type="text" name="search" placeholder="shipping cost" style="width: 120px; height: 30px;"  /><br>
                                            <select name="selectSm" id="SelectLm" class="form-control-sm form-control" style="width: 120px;">

                                                   <option value="0">Please select</option>
                                                    <option value="1">Option #1</option>
                                                    <option value="2">Option #2</option>
                                                    <option value="3">Option #3</option>
                                                    <option value="4">Option #4</option>
                                                    <option value="5">Option #5</option>
                                                </select>
                                            </td>
                                                <td>
                                                    <button type="button" class="btn btn-primary btn-md" onclick="postitem()">Submit</button>
                                            </td>
                                        </tr>

我尝试使用此功能

function postitem(index) {
   var formid='#myform'
    var panel= $(formid);
    var inputs = panel.find("input");
    console.log(inputs.value)

   }

，但未检索到文本值。我在做错什么，如何检索所有输入的文本值？

Answer 1

使用它来获取所有值。

$('input').each(function(index){ console.log($(this).val()); });

Answer 2

在输入字段中使用ID，然后获取该ID处元素的值。您可以像这样，以第一个输入字段为例：

function postitem(){
	console.log(document.getElementById('first_input').value);
}

 <tr class="tr-shadow" id="myform">

                     <td>

                        <span class="status--process">
                        <input class="au-input au-input--sm" id = 'first_input' type="text" name="search" placeholder="Search for datas &amp; reports..." style="width: 90px;" />
                        </span>

                                </td>
                                 <td class="desc"><input class="au-input au-input--sm qty" type="text" name="search" placeholder="i.e. 20 EA" style="width: 100px;" />
                                            </td>
                                             <td class="status--process" >
                                                 <input class="au-input au-input--sm" type="text" name="search" placeholder="shipping cost" style="width: 120px; height: 30px;"  /><br>
                                            <select name="selectSm" id="SelectLm" class="form-control-sm form-control" style="width: 120px;">

                                                   <option value="0">Please select</option>
                                                    <option value="1">Option #1</option>
                                                    <option value="2">Option #2</option>
                                                    <option value="3">Option #3</option>
                                                    <option value="4">Option #4</option>
                                                    <option value="5">Option #5</option>
                                                </select>
                                            </td>
                                                <td>
                                                    <button type="button" class="btn btn-primary btn-md" onclick="postitem()">Submit</button>
                                            </td>
                                        </tr>

Answer 3

我将在要捕获的每个输入控件上放置一个类，然后使用该类仅选择所需的输入。例如，我使用.captureInput，并将该类放置在每个输入和您的select元素上。

function postitem() {               
  $('#myform').find('.captureInput').each(function() {
    console.log($(this).val());
  });
}

这将为您提供所有值。

Answer 4

使用纯JavaScript，使用document.getElementsByTagName：

function findAll(){
var inputs = document.getElementsByTagName('input');
 for(var i = 0; i < inputs.length; i++){
   console.log(inputs[i].value);
  }
}

如何在div类中检索所有输入值

4 个答案: