Question

我在桌子上有一个输入标签：例子：

<table border="1" id="datatable">
<thead>
    <tr>
        <th>a</th>
        <th>b</th>
        <th>c</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            <input type='text' name="a[]" value="a1">
        </td>
        <td>
            <input type='text' name="b[]" value="b1">
        </td>
        <td>
            <input type='text' name="b[]" value="c1">
        </td>
    </tr>
    <tr>
        <td>
            <input type='text' name="a[]" value="a2">
        </td>
        <td>
            <input type='text' name="b[]" value="b2">
        </td>
        <td>
            <input type='text' name="c[]" value="c2">
        </td>
    </tr>
</tbody>

我想使用javascript从输入中获取价值。
我尝试过：

var x = document.getElementById("datatable").rows[1].cells;
alert(x[1].innerHTML);

但结果是：

<input type='text' value="a">

请帮助。谢谢

Answer 1

这是无效的html。每个输入元素应具有名称属性，这是表单数据提交的方式。然后，您可以使用value=document.querySelector("input[name='fred']").value;

编辑由于您使用的是方括号（并因此使用相同的名称发送回数组值），因此您将需要使用：

// create array for values
a_s_array = [];
// get input values
a_s = document.querySelectorAll("input[name='a[]']");
// loop through elements
for( var x=0; x<a_s.length; x++ ) {
// store input value into array
   a_s_array.push( a_s[x].value );
}

Answer 2

尝试一下：-

var x = document.getElementById("datatable").rows[1].cells;
alert(x[0].children[0].value);

Answer 3

您可以尝试以下jquery代码：

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>

</head>
<body>
<table border="1" id="datatable">
<thead>
    <tr>
        <th>a</th>
        <th>b</th>
        <th>c</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            <input type='text' name="a[]" value="a1">
        </td>
        <td>
            <input type='text' name="b[]" value="b1">
        </td>
        <td>
            <input type='text' name="b[]" value="c1">
        </td>
    </tr>
    <tr>
        <td>
            <input type='text' name="a[]" value="a2">
        </td>
        <td>
            <input type='text' name="b[]" value="b2">
        </td>
        <td>
            <input type='text' name="c[]" value="c2">
        </td>
    </tr>
</tbody>
<script>
    $(document).ready(function(){
        var td = $("#datatable").find('td');
        $.each(td, function() { 
            alert($(this).find('input[type="text"]').val()); 
        });
    });
</script>

</body>
</html>

如何从表中获取输入值（无ID）

3 个答案: