从html表中获取所有文本字段数据

时间:2015-01-13 09:16:17

标签: javascript jquery html

从自动生成的表中获取所有数据值并通过JavaScript警告循环显示这些值。我已经实现但是它没有在alert.how中显示任何内容我可以从这些自动生成的文本字段中获取值。 / p>

function myFunction() {
    var table = document.getElementById("myTable");
    var table1 = document.getElementById("myTable").length;
    var row   = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    var textf1  = '<div>FirstName:<input type="text"  value="Enter Your Name" id="text1" /></div>';
    var textf2  = '<div>LastName:<input type="text"  value="Enter Your Surname" id="text2" /></div>';
    cell1.innerHTML = textf1;
    cell2.innerHTML = textf2;
}



function first(){
        var x = document.getElementById("myTable");
        var textn = "";
        var texts= "";
        var i;
        var a;
        for (i = 0; i < x.length ;i++) {
            textn += text1[i].value + "<br>";
        }
        for (a = 0; i < x.length ;i++) {
            texts += text2[i].value + "<br>";
        }
        alert("First Name:"+textn"Second Name:"+texts);

    /*var table1 = document.getElementById("myTable").length;
    for(var row = 0; row <= table1;row++ ) {
        alert("Hello" + text1.value(i) + "Your Surname Is " + text2.value(i) + " You Have Chosen");
    }
    /*return myFunction()*/
    }
<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="js/myweb.js">

    </script>
</head>
<body>



<p>Click the button to add a new row at the first position of the table and then add cells and content.</p>

<table id="myTable"></table>
<table id="myTable1"></table>
<br>
<div id="first"></div>
<button onclick="myFunction()">Add Your First row</button>
<button onclick="first()">Submit</button>


</body>
</html>

2 个答案:

答案 0 :(得分:0)

function first(){
        var x = document.getElementById("myTable");
        var inputElements = x.querySelectorAll('input, select, textarea');
        for(var i = 0; i < inputElements.length; i++){

             alert(inputElements[i].value);
        }

    }

答案 1 :(得分:0)

alert("First Name:"+textn"Second Name:"+texts);

缺少+

alert("First Name:"+textn+"Second Name:"+texts);