Question

当用户在我的页面上提交表单时，我使用AJAX提交信息而不刷新页面。用户提交信息后，我想运行一个我已编写的PHP函数来显示信息。这是可能的还是我需要运行另一个ajax函数来更新

    $(function () {
       $('add').on('submit', function (e) {
          $.ajax({
            type: 'post',
            url: 'submit.php',
            data: $('this').serialize(),
            success: function () {
              alert('form was submitted');
            }
          });
          e.preventDefault();
          updateWords(); //PHP FUNCTION
        });
      });

Answer 1

您需要在第一个成功时运行另一个AJAX调用。

JavaScript无法直接与PHP交互，因此您无法从AJAX调用的success / complete函数调用PHP函数。

Answer 2

对此作出回应。

我在页面上有多个表单，可能还有5个不同的ajax调用如果json更好，那么同时调用不超过2个你有一些阅读材料或额外的堆栈的链接示例与此类似，所以我可以自学 - user934902

首先

jquery是针对旧浏览器而制作的，以支持ie6不支持的基本功能

如果你想在几乎所有浏览器上得到完全的支持，那么使用jquery是很好的

但也存在许多不好的方面：

它的81kb代码是疯狂的（没有插件）
与原生功能相比，速度非常慢。
它是由ppl使用的，他们不知道如何编写简单的javascript。
以及更多，如果我们开始谈论插件。

现在我们处在一个大多数人都使用他们的移动设备和现代浏览器的时代支持标准的javascript 1.7.Android，ios，safari，internet explorer 10，chrome，opera＆amp; firefox支持javascript 1.7

http://caniuse.com/

这些浏览器支持以下代码。

这是一个由我编写的ajax函数，它处理post＆amp;得到

您可以在此处详细了解该功能 https://stackoverflow.com/a/18309057/2450730

 function ajax(a,b,e,d,f,g,c){
  c=new XMLHttpRequest;
  !f||(c.upload.onprogress=f);
  !g||(c.onprogress=g);
  c.onload=b;
  c.open(e||'get',a);
  c.send(d||null)
 }
 // Params:
 // Url,callback,method,formdata or {key:val},uploadFunc,downloadFunc,placeholder

一个简单的获取请求将是

ajax('example.php',responseFunction);

并且复杂的帖子功能将是

ajax('example.php',responseFunction,'post',new FormData(form),uploadFunc,dlFunc);

你需要那个。

所以，如果你有表格

<form id="myForm">
<input name="name"> Name
<input name="surname"> Surname
<input name="mail"> Email
<input name="file" type="file" multiple> File/Files
</form>

你只需要写一个像这样的函数

var form=document.getElementsById('myForm');
form.onsubmit=function(e){
 e.preventDefault();
 ajax('submit.php',SUCCESS,'post',new FormData(this));
}

在这里我们回答你的问题：

根据需要创建submit.php文件

<?php
 // do whatever you need with the posted info 
 // copy files to a specific folder
 // insert/update/delete the database
 // check for errors
 // lets say no errors 
 $err=array(); 
 // load extra info from database to an array called $extrainfo
 // load some functions... (you can do what you want here)
 // like executing the function you have already written and add that info to 
 // the $extrainfo.
 $extrainfo=array('updated correctly','files copied');
 $data=array('post'=>$_POST,'files'=>$_FILES,'info'=>$extrainfo,'errors'=>$err);
 echo json_encode($data);
?>

这将返回一个json编码的数组，以便稍后在javascript中使用。

现在我们需要详细说明这个json。在SUCCESS函数中

function SUCCESS(){
 var data=JSON.parse(this.response);
 if(data.errors.length>0){
  // you have some errors 

 }else{
  // no errors
  // display your response in a proper way.
  console.log(data);
 }
}

在此功能中，您只需根据响应数据进行显示。

data包含您需要的一切。

这是整个代码。

复制并过去到txt文件并将其另存为submit.php。我现在只用铬测试过。

<?php
if($_POST){
$err=array();
$extrainfo=array('updated correctly','files copied');
$data=array('post'=>$_POST,'files'=>$_FILES,'info'=>$extrainfo,'errors'=>$err);
echo json_encode($data);
}else{
?><!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>upload</title>
<script>
var form,result;
function ajax(a,b,e,d,f,g,c){
 c=new XMLHttpRequest;
 !f||(c.upload.onprogress=f);
 !g||(c.onprogress=g);
 c.onload=b;
 c.open(e||'get',a);
 c.send(d||null)
}
function SUCCESS(){
    console.log(JSON.parse(this.response));
 var data=JSON.parse(this.response);
 if(data.errors.length>0){
  result.textContent='you have some errors:'+data.errors[0];
 }else{
  result.textContent=JSON.stringify(data, null, '\t');
 }
}
window.onload=function(){
 form=document.getElementById('myForm');
 result=document.getElementById('response');
 form.onsubmit=function(e){
  e.preventDefault();
  ajax('submit.php',SUCCESS,'post',new FormData(this));
 }
}
</script>
</head>
<body>
<form id="myForm">
<input name="name"> Name
<input name="surname"> Surname
<input name="mail"> Email
<input name="file[]" type="file" multiple> File/Files
<input type="submit" value="send">
</form>
<pre id="response"></pre>
</body>
</html>
<?php
}
?>

Answer 3

PHP是服务器端，javascript是客户端。如果页面已经加载，你就无法从客户端调用php。

所以简单的方法是ajax

在submit.php中添加：

echo json_encode($_POST);

或

我已编写的PHP函数

......您需要的信息。

并在成功函数中

success: function () {
 // i don't use jquery but the response contains the json string
 console.log('the words you wanna update:',JSON.parse(response));
 // updateWords(JSON.parse(response));
}

修改

你也不需要多个ajax函数

你说你已经写了一个脚本来向客户显示下一个信息。

将该脚本添加到submit.php

并且成功功能将为您提供所需的响应。

我添加了echo json_encode($_POST);，因为您需要的答案/更新信息大部分时间都是您刚发布的。

Answer 4

如果函数依赖于对submit.php完成的AJAX调用，则创建一个新的AJAX调用。如果没有，那么只需将函数附加到submit.php并在文件末尾调用它。

Answer 5

您应该使用执行更新信息的ajax函数同时更新页面本身。

只需返回可用的HTML作为ajax的返回值，并将其用作页面的HTML内容。

示例：test.php

<script>
  function updateName() {
    var url = './test.php?inpName='  + $('#inpName').val();
    $.get( url, function( data ) {
    $( "#frmDivUpdate" ).html( data );
      alert( "Call was performed." );
    });
  }
  </script>


  <div id="frmDivUpdate">
    <form>
      Enter your name : <input name="inpName" id="inpName">
      <br>
      <input type="button" onClick="updateName();" value="Update">
    </form>
  </div>

  <?php 

  if (isset($_GET))
  {
      $inpName = $_GET["inpName"];
      echo "You updated your val to $inpName";
  }
  ?>

在AJAX之后调用PHP函数

5 个答案: