如何使用jQuery的$ .ajax()函数来运行php脚本？


How can I use jQuery′s $.ajax() function to run php script?

本问题已经有最佳答案，请猛点这里访问。

为了理解这一点，我制作了一个示例代码，因为我的实际代码要大得多。

基本上，我想要完成的是运行我的PHP脚本，它使用Ajax编辑一个XML文件。这是因为我需要在我的实际项目中的一个JavaScript中完成这项工作。

这就是我目前为止所拥有的：

包含ajax函数的.php文件：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html>
<head>

function editXMLDoc()
{
  $.ajax({
  url:"sensors.php",
  context: document.body
}).done(function() {
  $( this ).addClass("done" );
});
}

</head>
<body>

<button type="button" onclick="editXMLDoc()">Endre XML</button>

</body>
</html>

下面是写入XML的PHP脚本：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
include 'sensor.php';
$b=new sensor();

$arr=$b->load('sensor.xml');        

for($i=0,$ms=count($arr);$i<$ms;$i++)
{
  if($arr[$i]['fields']['status']=='1')
  {
     $arr[$i]['fields']['status']='0';
  }else{
    $arr[$i]['fields']['status']='1';
  }
}
echo"Completed<br/>";
//3. save array to xml
$b->save('sensor.xml',$arr);
?>

我知道脚本在工作，所以我非常确定问题在于Ajax函数和PHP脚本之间的连接。

有人能帮我吗？

相关讨论

尝试此代码…实际上，您没有附加jquery库。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html>
    <head>
        <script src="http://code.jquery.com/jquery-latest.js">
        <script type="text/javascript">
            jQuery(document).ready(function($){
                var resp = $("#response");
                $.ajax({
                    type:"POST", // Method type GET/POST          
                    url:"sensors.php", //Ajax Action url
                    data: {},

                    // Before call ajax you can do activity like please wait message
                    beforeSend: function(xhr){
                        resp.html("Please wait...");
                    },

                    //Will call if method not exists or any error inside php file
                    error: function(qXHR, textStatus, errorThrow){
                        resp.html("There are an error");
                    },

                    success: function(data, textStatus, jqXHR){
                        resp.html(data);
                    }
                });
            });
       
    </head>
    <body>
       
    </body>
</html>
相关讨论

像这样使用Ajax：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<script type="text/javascript">
  jQuery(document).ready(function($){

    $('.rt11').click(function(){

        $.ajax({
            type:"POST", // Method type GET/POST          
            url:"sensors.php", //Ajax Action url
            data: {yourKey:"yourValue", yourKey1:"another value
<div class="suo-content">[collapse title=""]<ul><li>好的，但是如何用按钮调用这个函数呢？</li><li>在Ajax调用中，不需要"data"、"beforesend"和"type"属性来简化它。如果返回XML文件，则添加数据类型："xml"。</li><li>在$('.rt11')内传递元素选择器类或ID。单击(function()。{</li><li>@很抱歉今天中午没空，但当你说进去的时候，我该怎么做呢？我想应该是这样的：<button type="button"class="rt11">endre-xml<button></li><li>我的意思是，您使用的是class="rt11"，而这个类已经在大括号内使用了$(".rt11")，所以单击按钮，Ajax请求将调用。如果您使用的是火狐，那么安装一个名为firebug的插件，然后签入控制台，您将看到Ajax请求。</li><li>@satesh-hm.如果我放下按钮，让Ajax函数在每次加载页面时都运行，那么函数看起来如何？</li><li>然后您可以删除单击函数$('.rt11')。之后，Ajax将在页面加载时自动调用(function())。</li><li>SATEESH好！因为我怀疑这不起作用，这可能就是为什么我也不能让按钮工作的原因。所以我哪里出错了。为了让Ajax运行它，我需要在PHP脚本中说些什么吗？</li><li>不，Ajax是客户端脚本，所以PHP不能禁用它。我想你还有别的问题……你能分享你的链接吗？在那之后，我可以判断是否有错误。</li><li>我在本地主机上工作，但如果可以，我可以共享Dropbox链接？</li><li>是的，当然…只需分享你的链接</li><li>谢谢你，dropbox.com/sh/o07ng25hzc97xvk/aab5k6uqvcxadthrjoyf_4ya？dl=&zwnj；&8203；0</li></ul>[/collapse]</div><p><center>[wp_ad_camp_1]</center></p><hr><P>尝试这个，我认为您错过了包含jquery库文件。在Ajax调用之后，获取发布数据到您的PHP文件。</P>[cc lang="php"]    <!DOCTYPE html>
    <html>
    <head>
    //include the jQuery library file
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
   
    function editXMLDoc()
    {
      var myvalue='123';  
      $.ajax({
              url:"sensors.php",
              context: document.body,
              data: {myvalue:myvalue},  
             }).done(function() {
                 $( this ).addClass("done" );
             });
     }
   
    </head>
    <body>

    <button type="button" onclick="editXMLDoc()">Endre XML</button>

    </body>
    </html>
相关讨论

HTML:

1
<button type="button" id="idButton">Endre XML</button>

JS：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
  $("#idButton").click(function(){
        $.ajax({
                url: 'sensors.php',
                dataType:"xml", //if it returns a xml file
                success: function (data) {
                    // everything is ok
                    alert(data)

                },
                error: function (xhr, status, error) {
                    // Something went wrong
                    if (xhr.status > 0) alert('Error: ' + status);
                }
            });

        })

我认为代码中没有问题，但有时在大型代码中，min.js文件没有正确包含。请尝试以下代码。不需要更改sensors.php文件。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
<head>

$(document).ready(function(){
    $('.rt11').click(function(){
  $.ajax({
  url:"sensors.php",
  context: document.body
}).done(function(html) {
  $( this ).addClass("done" );
});
});
});

</head>
<body>

<button type="button" class="rt11">Endre XML</button>

</body>
</html>
相关讨论