Javascript AJAX表单刷新页面

已经搜索了一段时间，但找不到这个问题的正确答案。我有一个“金融”跟踪器，它有几个隐藏的div，当点击按钮显示div时，jQuery会显示这些div。我有一个资产跟踪器，它查询数据库，一旦选中，就会在复选框所在的相邻输入行中用新值更新数据库。我试图让复选框提交数据，而不会导致页面重新加载和div再次“切换”关闭

在表单部分，我试图删除

method='post'

，但在选中该框时，它重新加载了页面，并将所有post变量添加到URL字符串中。我删除了

action='FBook.php'

，试图防止重新加载，但这并没有解决问题

以下是PHP文件中的相关代码：

if(isset($_POST['AssetSetUpdate'])) { $AssetLastUpdate = $dtNowDate->format('Y-m-d');
foreach($_POST['AssetID'] as $key => $id) { if(isset($_POST['AssetSetUpdate'][$key])) {
$stmt_ATrackUp -> bindParam(':UpDate', $AssetLastUpdate, PDO::PARAM_STR, 10);
$stmt_ATrackUp -> bindParam(':UpNotes', $_POST['AssetNotes'][$key], PDO::PARAM_STR, 50);
$stmt_ATrackUp -> bindParam(':UpThis', $_POST['AssetDescription'][$key], PDO::PARAM_STR, 50);
$stmt_ATrackUp -> bindParam(':UpVal', $_POST['AssetValue'][$key], PDO::PARAM_INT, 3);
$stmt_ATrackUp -> execute(); } else continue; }
echo "<div class='Notice'>" . $PageTitle . " / Assets updated!</div>"; }

（其他守则）

（其他守则）

$AssetCounter=1；
$stmt_ATrack->execute（）；while（$row_ATrack=$stmt_ATrack->fetch（PDO:：fetch_ASSOC））
{   
$ChAge=$row_ATrack['Checked']；$cChAge=''；开关（true）
{
案例（strotime（$ChAge）>=strotime（'-7天'）：$cChAge='FBCAN'；break；
案例（strotime（$ChAge）>=strotime（'-30天'）：$cChAge='FBCA1'；break；
案例（strotime（$ChAge）>=strotime（'-90天'）：$cChAge='FBCA3'；break；
默认值：$cChAge='FBCA6'；中断；
}
if（isset（$row_-ATrack['Serial']）{$IfDSerial=“序列：”。$row_-ATrack['Serial']）。
；}否则{$IfDSerial=''；}
如果（isset（$row_ATrack['UPC']）{$IfDUPC=“UPC:”。$row_ATrack['UPC']）。“
”；}其他{$IfDUPC=”；}
如果（isset（$row_-ATrack['Related']）{$IfDRelated=“相关：”。$row_-ATrack['Related']）。
；}否则{$IfDRelated=''；}
if（isset（$row_-ATrack['Location']）{$IfDLocation=“位置：”。$row_-ATrack['Location']）。
；}否则{$IfDLocation=''；}
如果（isset（$row_ATrack['TagPhoto']）{$IfDTagPhoto=“标记照片：
”；}其他{$IfDTagPhoto=”；}
$IfDetails=“”。（$IfDSerial）。（$IfDUPC）。（$IfDRelated）。（$IfDLocation）。（$IfDTagPhoto）。”；
如果（$IfDetails==“”）{$IfDetails=''；}
回声“；
回声“；
回声“；
回显“$row_ATrack['Type']”-“$row_ATrack['Category']”；
回声“；
回声“；
回声“$ChAge.”；
回声“；
回显“$IfDetails.”；
回声“；
回声“；
$AssetCounter++；
}

您的JavaScript：

$("#AssetUpdateForm")

…正在使用

id=“AssetUpdateForm”

处理表单

你的PHP说：

id='AssetUpdateForm[" . $AssetCounter . "]'

在HTML中，它变成：

id='AssetUpdateForm[something]'

即使变量为空，您仍然有方括号，因此ID将不匹配，JavaScript事件处理程序将永远不会绑定到该元素

您需要使用真实的ID，或者，因为它似乎可以更改，所以在表单中添加一个

类

，并在JavaScript中使用

.class选择器

---

---

注意：您的HTML无效。您遇到的特定问题可能会导致与您描述的症状相同的症状，因此仅解决上述问题可能是不够的。使用并编写有效的HTML。

和HTML或PHP无关。结果表明jQueryAjax和

onclick='this.form.submit（）；'冲突属性。我删除了它，并将ajax请求更改为以下内容——尽管它仍然存在bug，因为它无法处理第二个ajax请求，但它验证了其他所有内容是否正常

$(".Check2Update").on('change', function(e) {
e.preventDefault();
$.ajax({
    type: 'post',
    url: 'FBook.php',
    data: $(this.form).serialize(),
    success: function(html) { 
        console.log('Successfully submitted AJAX!');
        $("#TableAssets").replaceWith($('#TableAssets', $(html)));
    }
    });

});

出于您的兴趣，您应该删除
success:function（）{alert（'form submitted'）；}，
行中的假逗号。JS和PHP对于伪逗号的行为不同，您应该删除该逗号。1。不要再看PHP了。如果表单正在提交，而您不希望它提交，那么如果HTML和JavaScript。从您的PHP进行调试非常困难，因为我们现在有一堆PHP，我们必须将其转换为HTML以了解发生了什么。2.使用时，您的HTML中有一些明显的错误（例如禁止使用表行的表行），这可能是浏览器完成补偿时出现问题的原因。我没有包含完整的代码，因为文件大小约为31 KB。我可以，但我真的不认为a在这里是被禁止的，因为它被放在一张桌子里。在哪种情况下，服务器会阻止ajax请求？使用firebug，它不会显示HTML错误、警告，甚至不会显示关于ajax失败的警报。这正是我所担心的，因为警报无法正常工作。我为表单分配了一个类，并从jQuery选择器调用该类，并删除了多余的逗号。对最终结果没有影响。使用w3验证器时显示999个错误（DIVs中不允许使用DIVs，
是无效标记？）
id='AssetUpdateForm[" . $AssetCounter . "]'

id='AssetUpdateForm[something]'

$(".Check2Update").on('change', function(e) {
e.preventDefault();
$.ajax({
    type: 'post',
    url: 'FBook.php',
    data: $(this.form).serialize(),
    success: function(html) { 
        console.log('Successfully submitted AJAX!');
        $("#TableAssets").replaceWith($('#TableAssets', $(html)));
    }
    });

});