jQuery AJAX post 到 PHP 对于 PDO INSERT 不使用变量 $('#id').val()

Question

我展示了 3 个代码片段。方法 1 和 2 不起作用第三个代码正在运行。

********* 不工作 1 开始 **************

<script>

 $(document).ready(function() {
             $('#sending').click(function(){   
// just 4 testing:
//var txtBoxVal = $('#TextBox1').val(); 
// alert(txtBoxVal); ==> ok: showing the value I want to send & INSERT into database via PDOinsertpost.php

     $.ajax({
                type: "POST",
                url: "./PDOinsertpost.php",                                                                                         
                data: 'postVal1=' + $('#TextBox1').val(),
                success: function(msg){
                    $('#reshow').html(msg);
                }

            }); // end Ajax Call
                // now trigger a reload via the click-function:             
            window.location.reload();
           }); //end event handler .click function 

    }); //end document.ready

</script>

********* 不工作 1 结束 **************

现在使用 $.ajax 中的变量的方法（效果不佳）：

********* 不工作 2 开始 **************

<script>

 $(document).ready(function() {
             $('#sending').click(function(){   
var txtBoxVal = $('#TextBox1').val();
 // an alert - just 4 testing:
// alert(txtBoxVal); // ok: showing the value I want to send & INSERT into database via PDOinsertpost.php

     $.ajax({
                type: "POST",
                url: "./PDOinsertpost.php",                                                                                         
                data: 'postVal1=' + txtBoxVal,
                success: function(msg){
                    $('#reshow').html(msg);
                }

            }); // end Ajax Call
                // now trigger a reload via the click-function:             
            window.location.reload();
           }); //end event handler .click function 

    }); //end document.ready

</script>

********* 不工作 2 结束 **************

现在 "hardcoded"，工作版本（？对我来说很好奇，这个正在工作 - 但其他人没有...）

********* working1 开始 **************

<script>
 var txtBoxVal = "some hardcoded string for testing";
 $(document).ready(function() {
             $('#sending').click(function(){   

     $.ajax({
                type: "POST",
                url: "./PDOinsertpost.php",                                                                                         
                data: 'postVal1=' + txtBoxVal,
                success: function(msg){
                    $('#reshow').html(msg);
                }

            }); // end Ajax Call
                // now trigger a reload via the click-function:             
            window.location.reload();
           }); //end event handler .click function 

    }); //end document.ready

</script>

********* working1 结束 **************

附加信息：与此同时，我发现一个空值正在与两个 "not-working" 代码片段一起使用 $('#id').val()，这意味着：在数据库中插入了一个空白值。

我是不是找错地方了？我是否需要使用 PDO-INSERT 在 .php 文件中做一些 htmlentities 之类的事情？

我希望，通过这个 post 可以收集到一些有用的信息 - 对我来说，对其他人也是如此。

提前致谢， -流.

Answer 1

我在这里看到 2 个大问题：

您正在重新加载页面（在所有示例中...），而 ajax 请求尚未完成。这是一种非常危险和错误的方法，因为您无法确定 php 脚本是否会正确完成。如果您以任何方式重新加载，则不需要 ajax.
您没有转义您的值，因此用户输入可能会破坏查询字符串。最简单的解决方案是使用一个对象，以便 jQuery 自动正确编码它：
data: { 'postVal1': $('#TextBox1').val() },

我也没有看到您取消了默认的表单提交，但是作为第三个示例，我假设按钮/#sending 元素不是提交按钮。如果没有，您也需要注意这一点。

编辑： 当您使用提交按钮时，您需要阻止常规表单提交：

$('#sending').click(function(event){
   // prevent the default form submit
   event.preventDefault();
   ...

Answer 2

没有 "window.location.reload();" 它似乎可以工作！ @jeroen 的解释可能是正确的：重新加载扰乱了进程！（但它没有在我的虚拟家庭服务器上......（可能是因为其他处理时间......））

jQuery AJAX post 到 PHP 对于 PDO INSERT 不使用变量 $('#id').val()

jQuery AJAX post to PHP for PDO INSERT not working with variables $('#id').val()

php

mysql

ajax

jquery

pdo