使用AJAX运行PHP代码

Nol*_*ski 4 javascript php ajax jquery

我编写了一些JavaScript代码,可以从Google Maps API中读取并获取JSON对象列表.然后它会将每个JSON对象转换为XML对象.同事需要将此列表转换为XML,然后将其附加到现有XML文件,然后将其保存到我们的服务器.所以我写了一些PHP代码来做到这一点.

现在这是我第一次使用PHP,但我设法很容易编写PHP代码.我要做的下一件事是编写一些javascript来运行PHP文件,并将XML对象发送到PHP,它可以附加并保存XML.我想我会使用jQuery的$.ajax功能.我开始使用一个简单的例子试图将字符串回显到某些<pre>标签中.所以这是我的代码:

Javascript(在index.php中)

<script>
    var scriptString = 'THIS IS MY STRING';
    $('#clickMe').click(function(){
        $.ajax(
        {
            method:'get',
        url:'index.php',
        data:
        {
            'myString': scriptString
        }
        });
    });
    </script>
Run Code Online (Sandbox Code Playgroud)

PHP和HTML(也位于index.php中)

<button type="button" id="clickMe">CLICK ME TO RUN PHP</button>
<pre>
    <?php
        echo $_GET['myString'];
    ?>
</pre>
Run Code Online (Sandbox Code Playgroud)

jny*_*len 7

  • 不要=在数据变量名中包含(只是说'myString': scriptString)

  • 始终包含$.ajax(method: 'get')的表单提交方法

  • 在PHP代码中,而不是$myString使用$_GET['myString']

  • 考虑使用a <button>而不是a <div>将数据发送到服务器 - 这是更标准的.

但最重要的是:

  • 你实际上并没有对返回的数据做任何事情!您还需要success$.ajax选项中使用一个函数来处理来自服务器的数据.

试试这段代码:

(JavaScript的)

var scriptString = 'THIS IS MY STRING';
$('#clickMe').click(function(){
    $.ajax({
      method: 'get',
      url: 'index.php',
      data: {
        'myString': scriptString,
        'ajax': true
      },
      success: function(data) {
        $('#data').text(data);
      }
    });
});
Run Code Online (Sandbox Code Playgroud)

(PHP和HTML)

<?php
if ($_GET['ajax']) {
  echo $_GET['myString'];
} else {
?>
<button type="button" id="clickMe">CLICK ME TO RUN PHP</button>
<pre id="data"></pre>
<?php } ?>
Run Code Online (Sandbox Code Playgroud)

请注意,PHP代码现在将根据它是否正在处理AJAX请求来执行不同的操作.对于AJAX请求,您不希望返回页面的HTML - 只是您感兴趣的数据.因此,最好有两个页面:一个index.php页面和一个ajax.php处理AJAX请求的页面.

此外,在这个简单的例子中,您可能只使用了纯HTML表单,不需要任何JavaScript或AJAX.