求JS得到动态生成文本框的值。。。

u010245070 2013-07-30 03:35:44

JS动态生成了一个表table1，表的行数未知，表第二列都有一个文本框
希望实现点提交按钮循环得到每个文本框的值

...全文

312 23 打赏收藏转发到动态举报

写回复

用AI写文章

23 条回复

切换为时间正序

请发表友善的回复…

发表回复

e251396 2013-07-31

打赏
举报

引用 21 楼 ILOVE_ASPNET 的回复:

tb.rows[i].cells[0].getElementsByTagName("input")[1]; 把这一句仔细想了想也是对的， rows[i].cells[0] 里面找 input ，返回来的就是一个数组，[1]是取数组的下标了，只是一时间没想过来。

这种方法是jq出来之前用的。

ILOVE_ASPNET 2013-07-30

打赏
举报

tb.rows[i].cells[0].getElementsByTagName("input")[1]; 把这一句仔细想了想也是对的， rows[i].cells[0] 里面找 input ，返回来的就是一个数组，[1]是取数组的下标了，只是一时间没想过来。

Go 旅城通票 2013-07-30

打赏
举报


<table id="table1">
<tr><td>1</td><td><input type="text" value="1" /></td></tr>
<tr><td>1</td><td><input type="text" value="2" /></td></tr>
<tr><td>1</td><td><input type="text" value="3" /></td></tr>
<tr><td>1</td><td><input type="text" value="4" /></td></tr>
<tr><td>1</td><td><input type="text" value="5" /></td></tr>
<tr><td>1</td><td><input type="text" value="6" /></td></tr>
</table>
<script>
    window.onload = function () {
        var tb = document.getElementById('table1'), input//注意你table的id
        for (var i = 0, j = tb.rows.length; i < j; i++) {
            input = tb.rows[i].cells[1].getElementsByTagName('input')[0];//上面贴出来的代码分号放错位置了
            if (input) alert(input.value);
        }
    }
</script>

ILOVE_ASPNET 2013-07-30

打赏
举报

引用 17 楼 u010245070 的回复:

[quote=引用 15 楼 showbo 的回复:]

    var tb = document.getElementById('table1'),input
    for (var i = 0, j = tb.rows.length; i < j; i++) {
        input = tb.rows[i].cells[1].getElementsByTagName('input'); [0]
        if (input) alert(input.value);
     }

这个语法是不是有错，为什么我测试没有进循环呢？[/quote] 可以的啊，我刚都测试了下，我也是没见过这样的语法



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
</head>
<body>
    <table id="tb1">
        <tr>
            <td>
                <input name="txtOne" value="1" /><input value="1111" />
            </td>
            <td>
                <input name="txtTwo" value="2" />
            </td>
        </tr>
        <tr>
            <td>
                <input name="txtOne" value="11" /><input value="3333" />
            </td>
            <td>
                <input name="txtTwo" value="22" />
            </td>
        </tr>
        <tr>
            <td>
                <input name="txtOne" value="111" />
            </td>
            <td>
                <input name="txtTwo" value="222" />
            </td>
        </tr>
    </table>
    <input type="button" onclick="doSubmit()" />
    <script>
        var tb = document.getElementById("tb1");
        for (var i = 0; i < tb.rows.length; i++) {
            var value = tb.rows[i].cells[0].getElementsByTagName("input")[1];
            if (value != undefined)
                alert(value.value);
        }
    </script>
</body>
</html>

ILOVE_ASPNET 2013-07-30

打赏
举报

cells[0].getElementsByTagName("input")[1] 刚理解了下，后面这个[1] 指是当前这个td里面的第几个input 这个就是td里面的第二个input.

u010245070 2013-07-30

打赏
举报

引用 15 楼 showbo 的回复:

    var tb = document.getElementById('table1'),input
    for (var i = 0, j = tb.rows.length; i < j; i++) {
        input = tb.rows[i].cells[1].getElementsByTagName('input'); [0]
        if (input) alert(input.value);
     }

这个语法是不是有错，为什么我测试没有进循环呢？

ILOVE_ASPNET 2013-07-30

打赏
举报

引用 15 楼 showbo 的回复:

    var tb = document.getElementById('table1'),input
    for (var i = 0, j = tb.rows.length; i < j; i++) {
        input = tb.rows[i].cells[1].getElementsByTagName('input'); [0]
        if (input) alert(input.value);
     }

学习了，原来JS还可以这样写tb.rows[i].cells[1].getElementsByTagName('input'); [0] 这句，问下楼主，后面这个[0] 就表示匹配第一个input 是吧。

Go 旅城通票 2013-07-30

打赏
举报

    var tb = document.getElementById('table1'),input
    for (var i = 0, j = tb.rows.length; i < j; i++) {
        input = tb.rows[i].cells[1].getElementsByTagName('input'); [0]
        if (input) alert(input.value);
     }

fzfei2 2013-07-30

打赏
举报

引用 12 楼 u010245070 的回复:

我不是要提交表单啊，我是要打印出每个值做其他用

是这意思?


 <input type="text" name="txtName" value="1"  />
<input type="text" name="txtName" value="2" />
 <input type="text" name="txtName" value="3"  />
<script>
 var els=document.getElementsByName('txtName')
 var vs=[];
 for(var i=0;i<els.length;i++)vs.push( els[i].value);
 alert(  vs  )
 </script>

ILOVE_ASPNET 2013-07-30

打赏
举报

引用 10 楼 u010245070 的回复:

全部复制测试的确实没效果

你是把我的代码加进去你的项目里面了？还是完全复制的我的代码？如果是完全复制我的代码要保证有 <script src="Scripts/jquery-1.7.2.min.js" type="text/javascript"></script> 这个文件，上面的几种只是方式，根据你的要求，最好的就是给文本框取个name,就根据这个name获取就好， $("table tr").each(function (i) { 这种方式比较适用于，获取一个tr下面多个TD里面的值的时候才这么去遍历。

u010245070 2013-07-30

打赏
举报

引用 11 楼 fzfei2 的回复:

[quote=引用楼主 u010245070 的回复:] JS动态生成了一个表table1，表的行数未知，表第二列都有一个文本框希望实现点提交按钮循环得到每个文本框的值

只要把 table 放在 <form> 下表第二列每个一个文本框 <input name="name1"> 的name 设置与一样的表单自动会拼在一起提交，要独立提交，就取不一样的名字根本都不概要 JS 参与处理[/quote] 我不是要提交表单啊，我是要打印出每个值做其他用

fzfei2 2013-07-30

打赏
举报

引用楼主 u010245070 的回复:

JS动态生成了一个表table1，表的行数未知，表第二列都有一个文本框希望实现点提交按钮循环得到每个文本框的值

只要把 table 放在 <form> 下表第二列每个一个文本框 <input name="name1"> 的name 设置与一样的表单自动会拼在一起提交，要独立提交，就取不一样的名字根本都不概要 JS 参与处理

u010245070 2013-07-30

打赏
举报

全部复制测试的确实没效果

ILOVE_ASPNET 2013-07-30

打赏
举报

引用 8 楼 u010245070 的回复:

[quote=引用 4 楼 ILOVE_ASPNET 的回复:] 或者


   <script>
        function doSubmit() {

            $("table tr").each(function () {
                var name = $(this).find("td:nth-child(2) input").val();
                alert(name);
            })
        }
    </script>

测试没有效果啊[/quote]



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
    <title>无标题文档</title>
</head>
<body>
    <form>
    <table>
        <tr>
            <td>
                11
            </td>
            <td>
                <input type="text" name="txtName" />
            </td>
        </tr>
        <tr>
            <td>
                11
            </td>
            <td>
                <input type="text" name="txtName" />
            </td>
        </tr>
        <tr>
            <td>
                11
            </td>
            <td>
                <input type="text" name="txtName" />
            </td>
        </tr>
        <tr>
            <td>
              
            </td>
            <td>
                <input type="text" name="txtName" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="button" onclick="doSubmit()" value="Submit" />
            </td>
        </tr>
    </table>
    </form>
   <script>
       function doSubmit() {
           var result = "";
           $("table tr").each(function (i) {
               var name = $(this).find("td:nth-child(2) input").val();
               if (name == undefined) return;
               result += "第" + i + "行文本框值:" + name + " <br />";
           })
           $("body").append(result);
       }
    </script>
</body>
</html>

不可能没效果啊

u010245070 2013-07-30

打赏
举报

引用 4 楼 ILOVE_ASPNET 的回复:

或者


   <script>
        function doSubmit() {

            $("table tr").each(function () {
                var name = $(this).find("td:nth-child(2) input").val();
                alert(name);
            })
        }
    </script>

测试没有效果啊

ILOVE_ASPNET 2013-07-30

打赏
举报

引用 3 楼 u010245070 的回复:

[quote=引用 1 楼 KongHuLu 的回复:] 设置这些input的class相同点击提交时用$("#table1 .inputclass")获取到的就是一个数组

能不能一个个的得到值呢？[/quote]



      $("#table1 .inputclass").each(function () {
            var value = $(this).val();
        })

潮起潮落 2013-07-30

打赏
举报

引用 3 楼 u010245070 的回复:

[quote=引用 1 楼 KongHuLu 的回复:] 设置这些input的class相同点击提交时用$("#table1 .inputclass")获取到的就是一个数组

能不能一个个的得到值呢？[/quote] 用eq就能定位单个值取到所有就循环啊

一天要饭生活又开始啦 2013-07-30

打赏
举报

var arr = []; $('#table1').find('tr').each(function() { arr.push($(this).find('td').eq(1).find('input').val()); });

ILOVE_ASPNET 2013-07-30

打赏
举报

或者


   <script>
        function doSubmit() {

            $("table tr").each(function () {
                var name = $(this).find("td:nth-child(2) input").val();
                alert(name);
            })
        }
    </script>

u010245070 2013-07-30