Question

我有一张这样的桌子。

<form id="myform">
   <table>
     <tr><th>TEST</th> <th>VALUES</th> <th>UNIT</th>
     <tr><td>Abc</td><td><input type="text" ></td><td>unit 1</td></tr>
     <tr><td>DEF</td><td><input type="text" ></td><td>unit 12</td></tr>
     <tr><td>ASD</td><td><input type="text" ></td><td>unit 321</td></tr>
   </table>
         <input type="button" id="btn" value="click" />
 </form>

我从#myform格式获取的值不为空。我正在使用jquery，这是代码。

$('#btn').click(function(){
          var store = [];
          var i = 0;
     $('#myform :input[type="text"]').each(function(){
       var testVal = $(this).val();
       if(testVal != null){
        store[i] = testVal;
         i++;
          }
   });
 });

此代码获取那些非null的值，它运行良好。但我想得到那些非空的输入字段的TEST和UNIT值例如：
如果我在第二个输入字段中提供值，那么它也会得到DEF，value which is provid和unit 12。单位是该输入字段的下一个，而测试是可以接受的。
我怎么能这样做，plz。
Thankx。

Answer 1

您可以按如下方式创建js对象数组：

$('#btn').click(function () {
    var store = [];
    $('#myform :input[type="text"]').map(function () {
        var test = $(this).parent().prev().text();
        var values = $(this).val();
        var unit = $(this).parent().next().text();
        if (values) {
            store.push({
                test: test,
                value: values,
                unit: unit
            });
        }
    });
    console.log(JSON.stringify(store));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myform">
    <table>
        <tr>
            <th>TEST</th>
            <th>VALUES</th>
            <th>UNIT</th>
        </tr>
        <tr>
            <td>Abc</td>
            <td>
                <input type="text" />
            </td>
            <td>unit 1</td>
        </tr>
        <tr>
            <td>DEF</td>
            <td>
                <input type="text" />
            </td>
            <td>unit 12</td>
        </tr>
        <tr>
            <td>ASD</td>
            <td>
                <input type="text" />
            </td>
            <td>unit 321</td>
        </tr>
    </table>
    <input type="button" id="btn" value="click" />
</form>

例如，您可以遍历store数组并访问store[i].test等值。

_{请注意，如果test和unit列为空，则对象中的相应值将为null}

使用jquery从html表中获取值

1 个答案: