动态创建的表单Input无法通过AJAX POST提交至PHP脚本求助

我看了你的代码，问题主要出在动态元素的DOM位置、元素创建/移除的写法，还有一些小语法错误上，导致表单序列化时没捕获到动态生成的checkbox。下面给你一步步修正：

1. 确保动态元素在表单内部 #

$("#form-pay").serialize()只会序列化这个表单内部的所有表单控件，所以你动态创建的div#trtr必须放在#form-pay表单的DOM范围内。如果你的xx容器不在表单里，记得把动态元素插入到表单内的容器中。

2. 修正动态元素的创建与移除逻辑 #

原来的代码里创建元素ID的方式有问题，移除元素的写法也不够精准，改成这样：

function forn(that) {
    // 先移除已存在的动态元素，避免重复创建
    $("#trtr").remove();
    
    if (that.value == "ps") {
        var x = document.getElementById("xx");
        var rr = document.getElementById("rtrt");
        var trtr = document.createElement("div");
        trtr.id = "trtr"; // 直接赋值ID，不要用+=
        trtr.className = "col-sm-3 form-group";
        
        var input1 = document.createElement("input");
        input1.type = 'checkbox';
        input1.name = "_fr";
        input1.style.marginTop = "3em";
        trtr.appendChild(input1);
        
        var label = document.createElement("label");
        label.className = "form-control-label mbr-fonts-style display-7";
        label.innerText = "yes";
        label.style.marginRight = "0.5em";
        trtr.appendChild(label);
        
        x.insertBefore(trtr, rr.nextSibling);
    }
}

3. 修复AJAX代码的语法错误和逻辑 #

你AJAX成功回调里多了一个右括号，而且误用了字符串"data"而非返回的响应数据，修正后：

$(document).on('click', '#calc', function (e) {
    e.preventDefault(); // 先阻止默认提交行为，避免页面跳转
    var data = $("#form-pay").serialize();
    alert(data); // 弹窗查看序列化后的数据，确认是否包含_fr参数
    
    $.ajax({
        data: data,
        cache: false,
        type: "POST",
        url: "calc_price.php",
        success: function (response) {
            $("#estelam").remove(); // 直接通过ID移除元素，更高效
            var form = document.getElementById("xx");
            var btns = document.getElementById("btns");
            var div = document.createElement('div');
            div.id = "estelam";
            div.className = "alert alert-success";
            div.style.display = "inline-block";
            div.textContent = response; // 更简洁的文本赋值方式
            form.insertBefore(div, btns);
        }
    });
});

4. PHP端的接收逻辑 #

注意：HTML复选框只有被选中时才会被提交到后端，所以PHP里要判断参数是否存在：

<?php
// 处理动态提交的复选框
$fr = isset($_POST['_fr']) ? $_POST['_fr'] : false;
// 若需要自定义值，可给input加value属性，比如input1.value = '1';

// 其他业务逻辑
?>

关键提醒 #

• 如果alert(data)里看不到_fr参数，要么是元素不在表单里，要么是复选框没被选中
• 尽量用ID选择元素，避免$("div").remove("#trtr")这种遍历所有div的写法，既低效又容易误删元素

内容的提问来源于stack exchange，提问作者FIFO