jQuery更新隐藏的输入值，但不传递给POST变量 - jQuery updates hidden input value, but does not pass to POST variable

jQuery updates hidden input value, but does not pass to POST variable

我已经为地址数据构建了一个HTML表单，我想在通过POST变量将所有表单字段提交给SQL数据库之前计算地址的纬度和经度。

现在我的控制台显示，我成功地编辑了隐藏的"latInput"answers"lngInput"字段DOM与lat/lng值。但是，PHP脚本中的POST变量没有捕捉到该更改。

隐藏表单字段:

<input type="hidden" name="latInput" id="latInput" value="">
<input type="hidden" name="lngInput" id="lngInput" value="">

jQuery设置/检查DOM更新到隐藏字段:

//insert new lat/lng variables to the hidden form inputs, so PHP can access POST and insert into SQL database
$("#latInput").attr('value',localLat);
$("#lngInput").attr('value',localLng);
//confirm hidden input fields were set with lat/lng values
console.log("latInput set to: " + $("input[name=latInput]").val());
console.log("lngInput set to: " + $("input[name=lngInput]").val());

PHP脚本检查POST变量的lat/lng，并提交所有字段到数据库:

$lat = $_POST['latInput'];
$lng = $_POST['lngInput'];
echo('<p>POST variable for lat = '.$lat.'</p>');
echo('<p>POST variable for lng = '.$lng.'</p>');
//choose SQL fields (column names), then choose HTML form fields ("name" attribute)
$sql = "INSERT INTO $tablename (name,address1,city,state,zip,latitude,longitude) VALUES ('$_POST[firstName]','$_POST[address1]','$_POST[city]','$_POST[state]','$_POST[zipCode]','$_POST[latInput]','$_POST[lngInput]')";

请注意—所有其他表单字段(address1, city等)都成功地传递POST变量并在提交时进入数据库。尽管DOM正在更新隐藏的latInput和lngInput字段，但这并没有拉到我的本地$lat和$lng变量。POST仍然不返回任何值。我试过用下面的虚拟数据更新原始隐藏的latInput和longinput字段，并且虚拟数据通过良好。

虚拟数据:

<input type="hidden" name="latInput" id="latInput" value="1.234">
<input type="hidden" name="lngInput" id="lngInput" value="2.345">

知道为什么这个下降了吗?

谢谢你的帮助!

我也遇到了同样的问题。这个回答帮助了我。解决方案是使用name选择器代替id。形式:

<form id="my-form" action="post">
  <input type="hidden" name="latInput">
  <input type="hidden" name="lngInput">
  <input type="submit" value="Submit">
</form>

JQuery

$('#my-form input[name=latInput]').val(localLat);
$('#my-form input[name=latInput]').val(localLng);

这些值将成功传递给POST。

正确设置输入值的方法是使用val()函数

$("#latInput").val(localLat);
$("#lngInput").val(localLng);