Javascript 从jQuery调用php函数

我在

PHP

文件中有一个

saveTestObject（）

方法，我需要用

jQuery

从

HTML

调用它。我环顾四周，但似乎没有完整的例子。我真的很感激

这是我的

PHP

文件，名为

SM.PHP

：

<?php

switch($_POST["functionname"]){ 

     case 'saveTestObject': 
        saveTestObject();
        break;   
}   

function saveTestObject() {
    echo "saveTestObject CALLED";

    $object = ParseObject::create("TestObject");
    $objectId = $object->getObjectId();
    $php = $object->get("elephant");

    // Set values:
    $object->set("elephant", "phpserver");
    //$object->set("today", new DateTime());
    $object->setArray("mylist", [1, 2, 3]);
    $object->setAssociativeArray(
      "languageTypes", array("php" => "awesome", "ruby" => "wtf")
    );

    $object->save();
}

?>

如何将两者连接起来，以便在按下提交按钮时调用

saveTestObject（）

函数

---

SM.php

和

smpage.html

都位于我的web服务器的

文档的save目录中
 您已经标记了jQuery，所以让我们使用它，因为您正在打开
$\u POST[“functionname”]

这将向sw.php发送一个请求，post数据为
functionme=saveTestObject
，因此调用函数是因为
开关的情况

编辑
这将使您的HTML文件变得像

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<form>    
    First name: <input type="text" name="fname"><br>
    Last name: <input type="text" name="lname"><br>    
    <input type="submit"/>
</form>

<script>
    $("form").submit( function(event) {
        event.preventDefault();
        $.ajax({
          type: "POST",
          url: 'sw.php',
          data: {
                "functionname": "saveTestObject", 
                "fname" : $("form input[name=fname]").val(),
                "lname" : $("form input[name=lname]").val()
          },
          success: function(response) { $("#response").html(response); }
        });
    });
</script>


名字：

姓氏：

$（“表格”）。提交（功能（事件）{
event.preventDefault（）；
$.ajax({
类型：“POST”，
url:'sw.php'，
数据：{
“functionname”：“saveTestObject”，
“fname”：$（“表单输入[name=fname]”）。val（），
“lname”：$（“表单输入[name=lname]”）。val（）
},
成功：函数（response）{$（“#response”）.html（response）；}
});
});

然后你可以使用


$\u POST['functionname']
$\u POST['fname']
$\u POST['lname']

success
是可选的，但我希望看到AJAX请求的结果。如果需要，请将id为
response
的div添加到文件（
）中希望显示结果的位置。
要使用ajax调用该函数，可以执行以下操作：

$.ajax({
   url: "SM.php", //The requested url
   type:"POST", //The request type, post, get...
   data: {functionname:"saveTestObject"} //The data you want to send to server
});

您必须对页面进行AJAX调用

 $('form input[type=submit]').on('click', function(e) {
    e.preventDefault();
    $.post('SM.php', {fname : $('form input[name=fname]').val(), lname : $('form input[name=lname]').val(), functionname: 'saveTestObject'});
 });

只是一个简短的说明。此情况下需要preventDefault，因为它将停止提交事件（重定向浏览器）

编辑：添加了url。
您好，请复制此代码并将其复制到“smpage.html”文件并运行它。
Hi Copy this code and past to 'smpage.html' file run it. 
            <script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
            <script type='text/javascript'>
            $("#formid").submit(function(event){
            $fname_val=$("input[name=fname]").val();
            $lname_val=$("input[name=lname]").val();
               $.ajax({
                    url: "SM.php",
                    type: "post",
                    data: {'functionname':'saveTestObject','firstname':$fname_val,'lastname':$lname_val},
                    success : function(data){
                          alert("Data saved successfully !");
                    },
                    error: function(){
                        alert('failed');
                    }
                });

            });
            </script>
            <form id="formid">    
                First name: <input type="text" name="fname"><br>
                Last name: <input type="text" name="lname"><br>    
                <input type="submit"/>
            </form>
            ----------smpage.html---------------------------

$（“#formid”）.submit（函数（事件）{
$fname_val=$（“输入[name=fname]”）.val（）；
$lname_val=$（“输入[name=lname]”）。val（）；
$.ajax({
url:“SM.php”，
类型：“post”，
数据：{'functionname'：'saveTestObject'，'firstname'：$fname\u val，'lastname'：$lname\u val}，
成功：功能（数据）{
警报（“数据保存成功！”）；
},
错误：函数（）{
警报（“失败”）；
}
});
});
名字：

姓氏：

----------smpage.html---------------------------
OK的可能重复，但如何从html表单中调用此ajax？有一个触发器。任何东西你希望你的触发器是什么？我想表单输入不仅仅是为了好玩——尽管OP需要确认，只需监听按钮的点击<代码>$（“表单”）.submit（函数（）{
@ᵈˑ谢谢，但是你能添加一个html文件的完整示例吗？我是PHP/jQuery新手。我想表单输入不仅仅是为了好玩——尽管OP需要确认+1以记住（并提醒我）在
e.preventDefault（）
@MinusFour上的内容，但你的代码出于某种原因不会调用函数。它识别SM.PHP文件（如果我更改了名称，我会收到一个错误。）但是函数没有被调用，如果我将其名称更改为随机的，functionname:“whateverrandom”我甚至没有收到错误消息。它是否与我的SM.php有关？你能看看我问题中的吗？检查你的浏览器网络选项卡（如果你使用chrome，请查看F12）查看ajax调用。检查是否有数据输出到SM.php调用。没有显示任何警报，并且没有调用saveTestObject中的回显。嘿，请为我错过的脚本添加ready函数。$（文档）。ready（函数（）{}）；我应该在哪里添加它？
$(function(){

  //If you submit the form:
  $("form").submit(function(){

    //post data to your php file
    $.post("SM.php", {functionname: 'saveTestObject'}, function(re){
      alert("Saved. returned" + re);
    });
    return false;
  });

});

 $('form input[type=submit]').on('click', function(e) {
    e.preventDefault();
    $.post('SM.php', {fname : $('form input[name=fname]').val(), lname : $('form input[name=lname]').val(), functionname: 'saveTestObject'});
 });

Hi Copy this code and past to 'smpage.html' file run it. 
            <script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
            <script type='text/javascript'>
            $("#formid").submit(function(event){
            $fname_val=$("input[name=fname]").val();
            $lname_val=$("input[name=lname]").val();
               $.ajax({
                    url: "SM.php",
                    type: "post",
                    data: {'functionname':'saveTestObject','firstname':$fname_val,'lastname':$lname_val},
                    success : function(data){
                          alert("Data saved successfully !");
                    },
                    error: function(){
                        alert('failed');
                    }
                });

            });
            </script>
            <form id="formid">    
                First name: <input type="text" name="fname"><br>
                Last name: <input type="text" name="lname"><br>    
                <input type="submit"/>
            </form>
            ----------smpage.html---------------------------