當復選框被更改時，ajax post表單jquery ajax無法正常工作

Question

我正在嘗試創建一個表單提交復選框更改我的代碼如下。 。 我的問題沒有發生

gotofile.php

文件，但執行成功函數// dosomething

jquery：

$("#container input[type=checkbox]").change(function(e){
                if($(this).attr('checked')) 
                {

                    var cnType=$(this).attr("id");

                    $.ajax({
                        type: "POST",
                        url: "gotofile.php",
                        data: "typID="+cnType ,
                        cache: false,
                        success: function(){ 
                            //do something 
                        }
                    });
                }
            });

php：

include '../dbconnection/dbconfig.php';


$typeID=$_POST['typID'];
$qryConnections="INSERT INTO ...";
$rslt1 = mysql_query($qryConnections);

HTML

<form id="cnct" method="POST">
                            <div id="container" style="">
                                <ul style="list-style: none;">
                                   <li><input type="checkbox" id="1" />A</li>
                <li><input type="checkbox" id="2" />B</li>

                                </ul>
                            </div></form>

任何人都能幫我解決我做錯的事嗎？

Answer 1

一些安全問題

請記住，導航到您網站的任何人都可以看到您的JS。 使用：

data : "typID="+cnType

會讓我覺得typID是你SQL中的字段。 您沒有CSRF過濾器，因此我可以編寫一個ajax腳本來欺騙有效請求並從外部位置更新所有字段。 需要注意的一點是，我建議您閱讀CSRF或Cross Site Request Forgery。

為什么你的腳本不起作用

如果成功函數正在觸發，則腳本已運行。 通過在PHP中輸出$ _POST ['typID']的值來調試它。 如果發送正確，您將在控制台中看到變量值。

除此之外，讓你的PHP回顯出你的成功函數的JSON響應，以驗證一切順利。

echo json_encode(array('response' => 'success'));

或者('response' => 'failed')或者你需要的任何東西。 然后，您可以在success函數中評估JSON。

我希望這有幫助。

Answer 2

首先，您應該在Jquery代碼中使用click而不是change事件作為復選框。

第二件事，你沒有為你的html代碼中的復選框提供任何價值。

請問它是否對你不起作用。

Answer 3

嘗試

        $("#container input[type='checkbox']").click(function(e){

                var cnType=$(this).attr("id");

                $.ajax({
                    type: "POST",
                    url: "gotofile.php",
                    data: "typID="+cnType ,
                    cache: false,
                    success: function(){ 
                        //do something 
                    }
                });
         });