带有PHP的jQuery AJAX将内容上传到MYSQL DB

Question

我正在寻找一个jQuery AJAX脚本以及一个PHP脚本，该脚本允许在单击按钮时存储信息。 jQuery中定义的函数应带有三个变量，所有这些变量均在方法调用前定义。 我的操作基础已经完成，但是在所有操作的最后-单击按钮并且经过了一段时间后-没有数据添加到适当的mysql数据库中。

这是我的jQuery函数“商店”

<script type="text/javascript">
function store(ud, ld, tp) {
$.ajax({
  url: 'http://www.exampledomain.com/folder/store.php',
  type: 'POST',
  data: 'ud='+ud+'&ld='+ld+'&tp='+tp
  success  : function() {
        alert("WORKED!");
  },
  error    : function() {
        alert("DIDN'T WORK!");
  },
  complete : function() {
  }
  });
}
</script>

这是store.php文件（我知道非常基本，我还没有通过清理用户输入来保护此脚本）

<?php

require ('../mysqli_connect.php');

$errors = 0;

if(isset($_POST['ud']) && is_numeric($_POST['ud'])) {
    $ud = $_POST['ud'];
} else {
    ++$errors;
}
if(isset($_POST['ld']) && is_numeric($_POST['ld'])) {
    $ld = $_POST['ld'];
} else {
    ++$errors;
}
if(isset($_POST['tp'])) {
    $tp = strip_tags(stripslashes($_POST['tp']));
} else {
    ++$errors;
}

if($errors == 0) {

    $q = "INSERT INTO table_name (column_1, column_2, column_3, column_4) VALUES ('$ld', '$ud', NOW(), '$tp')"; 
    mysqli_query($mysqli, $q);

} else {

echo 'There was a problem!';

}
?>

假设我具有onclick =“ store（3，3，A）”作为某个元素的属性。 我怎样才能解决这个问题？ 如果删除onclick属性，如何将必要的参数传递给jQuery函数？ 非常感谢您的帮助！

<-编辑->

新的jQuery和AJAX脚本 ...

<script type="text/javascript">

function store(ud, ld, tp) {
   $.ajax({
      url: 'http://www.exampledomain.com/folder/store.php',
      type: 'POST',
      data: 'ud='+ud+'&ld='+ld+'&tp='+tp,
          error    : function() {
            alert("error");
      },
      success  : function(data) {
            alert(data);
      },
      complete : function() {
            alert("complete");

      }
   });
}

$(function () {
  $("a.rec").on("click", function () {
    var $this = $(this),
        ud = $this.data("ud"),
        ld = $this.data("ld"),
        tp = $this.data("tp");

    store(ud, ld, tp); 
  });
});

</script>

修改PHP

<?php
if($_SERVER['REQUEST_METHOD'] === "POST"){

require ('../mysqli_connect.php');

$errors = 0;

if(isset($_POST['ud'])) {
    $ud = $_POST['ud'];
} else {
    ++$errors;
}
if(isset($_POST['ld'])) {
    $ld = $_POST['ld'];
} else {
    ++$errors;
}
if(isset($_POST['tp'])) {
    $tp = $_POST['tp'];
} else {
    ++$errors;
}

if($errors == 0) {

    $q = "INSERT INTO table_name (column_1, column_2, column_3, column_4) VALUES ('$ld', '$ud', NOW(), '$tp')";     
    mysqli_query($mysqli, $q);

} else {

    echo 'There was a problem!';

}

} else {

    $url = 'http://www.exampledomain.com/error.php';
    ob_end_clean();
    header("Location: $url");
    exit();

}
?>

现在为我的HTML

<li>
<div class="sample classes">
<a class="rec" data-ud="13" data-ld="10" data-tp="SCI">
<input type="submit" title="Something" value="Something" />
</a>
</div>
</li>

但是，单击此按钮后，它仍然不执行任何操作！

Answer 1

正如您所说的， onclick是您要避免的事情。 这就是你的做法。

$(function () { //This function will be ran when the page loads
  $(".button-class").on("click", function () { //This will run when any button is clicked
    var $this = $(this),
        ud = $this.data("ud"),
        ld = $this.data("ld"),
        tp = $this.data("tp");

    store(ud, ld, tp); 
  });
});

HTML

<input type="button" class="button-class" data-ud="3" data-ld="3" data-tp="A"/>

Answer 2

我发现使用JSON并将对象中的变量传递给服务器更容易：

<script>
    (function(){

        var store = function (ud, lrid, type) {

            var data = {
                        ud:ud,
                        lrid:lrid,
                        type:type
                };

            $.ajax({
              url: 'http://www.exampledomain.com/folder/store.php',
              type: 'POST',
              data: data,
              success  : function(data) {
                    alert(data);
              },
              error    : function() {
                    alert("DIDN'T WORK!");
              },
              complete : function() {
              }
              });
         };


        $('#btn').on('click', function(){

            store(1,2,3);

        });

    }());
    </script>

使用此脚本测试您是否在服务器端获取了变量：

<?php
# Put this in http://www.exampledomain.com/folder/store.php to test it works
if($_SERVER['REQUEST_METHOD'] === "POST"){
    if(
        isset($_POST['ud']) &&
        isset($_POST['lrid']) &&
        isset($_POST['type']) 
    )
    {
        $var = $_POST['ud'] . ", ".$_POST['ud']  . ", ".$_POST['type'] ." passed successfully via ajax!";
        echo json_encode($var);
    }

}
?>