php - 简单的 jquery ajax php 请求

Question

我正在对一个 php 文件进行基本的 jquery ajax 调用，但似乎无法弄清楚它为什么不起作用。任何帮助表示赞赏。Fiebug 似乎没有显示任何 ajax 或 XHR 操作正在进行。我不想刷新页面而只执行 ajax 调用。谢谢。

JS

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"</script>
<script>
function getData(url_param){
    $.ajax({
        type: 'get',
        url: 'data.php',
        data: {url_param:url_param},      
        success: function(data) {
            $('#data').html(data);        
        }
    });
};

$('#clickMe').click(function(e){
    e.preventDefault();
    getData(2);
});
</script>

HTML：

<div><a id='clickMe' href='data.php?url_param=url_param'>CLICK ME TO RUN PHP</a></div>
<div id="data"></div>  <!-- divto show result -->

PHP：

<?php

if($_GET['url_param']){
    echo "simple ajax call";
} 

?>

Answer 1

首先，你拼错了你的函数名（getGata != getData）。

第二：

data: {url_param:url_param}

您是否在任何地方设置了 javascript 变量url_param？$.ajax数据参数的格式如下：

get/post variable name : get/post variable value

正如您现在所拥有的，您似乎没有为url_param分配值。

Answer 2

您必须在 onload 函数中绑定事件。最常见的做法是：

$(document).ready(function(){

  $('#clickMe').click(function(e){
       ...
  });

});

您还应该return false;在事件的最后一行添加。

Answer 3

（已修改？）JavaScript 阻止您的代码工作，因为您没有关闭 jQuery 源代码上的尖括号，它应该是：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

其中一条评论指出你不应该在锚点中有 href，但是因为你忽略了默认值，所以不会触发（假设在用户的浏览器中启用了 JS）。

最后，我认为

return false;

之后应该真的在函数内部

getData(2);

但是由于我们忽略了默认值，所以锚不应该尝试去任何地方或重新加载。

Answer 4

您可以简单地使用 jQuery post 功能。

$.post('data.php',{param1:'your param 1', param2 : 'your param 2'}, function(response){
    //do your operation here. response is what you get from data.php. 'json' spicifies that the response is json type
    $("#data").html(response);
},'json');