Question

我有一个复选框列表，并希望在检查PHP时提交复选框的值。我不希望有一个提交按钮，而是每次选中一个复选框时发布值，这样表单就不会刷新并清除选中的复选框。但是，每次单击其中一个复选框时，都不会发生任何事情。

这是HTML：

<form method="post" action="this.form.submit();" name="form1">
        <input type="checkbox" name="checkboxList[]" onclick="function1();" value="1">value1</input>
        <input type="checkbox" name="checkboxList[]" onclick="function1();" value="2">value2</input>
        <input type="checkbox" name="checkboxList[]" onclick="function1();" value="3">value3</input>
</form>

这是JQuery：

function function1() {
    var data = $("form1").serialize();
    $.ajax({
        url: "test.php", 
        type: "POST",
        async: true,
        cache: false,
        data: data, 
        success: function(data){ 
            alert(data) 
        }
    });
}

编辑：对不起，忘了提到我已经包含了JQuery库。

＆＃34; test.php＆＃34;：

print_r($_POST);

Answer 1

而不是localStorageMock.getItem，您应该使用var data = $("form1").serialize();。使用像这样的普通字符串不会找到任何东西。您必须指定您希望元素具有名称＆＃39; form1＆＃39;

Answer 2

您需要使用onchange事件而不是onclick事件https://api.jquery.com/change/

Answer 3

试试这个：

<form method="post" name="form1">
        <input type="checkbox" name="checkboxList[]" value="1">value1</input>
        <input type="checkbox" name="checkboxList[]" value="2">value2</input>
        <input type="checkbox" name="checkboxList[]" value="3">value3</input>
</form>

JQuery的：

$("input[type=checkbox]").on("change", function() {
    var data = $("form1").serialize();
    $.ajax({
        url: "test.php", 
        type: "POST",
        async: true,
        cache: false,
        data: ({data: data}),
        dataType: "text", 
        success: function(data){ 
            alert(data) 
        }
    });
});

使用AJAX发布复选框列表而不提交按钮

3 个答案: