javascript - 如何使用 POST 或 GET 从 PHP 中 JS 生成的 HTML 输入中获取值

Question

我正在使用 javascript 制作输入网格。这些输入中的每一个都有一个唯一的名称和 ID:“test1”、“test2”...我还可以根据它们的名称更改这些输入的样式。

var c = document.getElementById("gridOne");

function createTable() {
var table = document.createElement('table');
var rows = +document.getElementById('numRows').value;
var cols = +document.getElementById('numCols').value;
    var n = 0;
for(var r=0; r<rows; r++) {
  var tr = document.createElement('tr');
  table.appendChild(tr);
  for(var c=0; c<cols; c++) {
    if(r == 0 || c == 0 || r == rows - 1 ||c == cols - 1 ){ 
        var td = document.createElement('td');
        tr.appendChild(td);
        var inp = document.createElement('input');
        inp.setAttribute('id', 'test'+n);
        inp.setAttribute('name', 'test'+n);
        inp.setAttribute('value', n);
        inp.setAttribute('type','number');
        td.appendChild(inp);
        n++;


    } else {
        var tq = document.createElement('td');
        tr.appendChild(tq);
        tq.classList.add('inner');
        var inp = document.createElement('input');
        inp.setAttribute('type','text');
        inp.disabled = true;
        tq.appendChild(inp);
    }
  }

}
var container = document.getElementById('input_container');
container.innerHTML = '';
container.appendChild(table);
}

处理和输出 JavaScript 的 HTML 代码是这样的

<form method="POST">
<div class="canvas" id="input_container">
<script type="text/javascript" src="js/Grid1.js"></script>
</div>
<input name="Confirm" type="submit">

当我尝试访问这些输入提交的值时出现错误。我正在使用 PHP，我尝试了 GET 和 POST，但没有成功。

    if (isset($_POST['Confirm'])) 
{
    $test0 =  $_POST['test0'];
    $test1 =  $_POST['test1'];
    $test2 =  $_POST['test2'];
}

我的代码适用于除动态生成的输入表单之外的所有内容。

Answer 1

您遇到的错误实际上不是错误，而是通知。

Undefined index: test0 in x on line y

为避免这种情况，您应该首先检查这些值是否存在，即:

$test0 = isset($_POST['test0']) ? $_POST['test0'] : 'default value';

或使用 PHP7 null coalescing operator :

$test0 = $_POST['test0'] ?? 'default value';

解决问题的更好方法

我认为处理动态生成的字段的更好方法是使用数组。所以你应该:

• 使用 [name] 属性，最后用大括号 []
• 在后端，遍历该数组。

因此，示例代码可能如下所示:

<input type="number" name="test[]">
<input type="number" name="test[]">
<input type="number" name="test[]">

和PHP:

foreach ($_POST['test'] as $test) {
    var_dump($test);
}