0

这是我的预览问题的更清晰的代码，其想法是使用 ajax 发送和检索一个值，但该值没有被发送，ajax 似乎也不起作用。我更新了这段代码，因为这样可以很容易地在任何机器上进行测试。第一次使用ajax。这是代码：

Javascript

<script>
jQuery(document).ready(function() {
jQuery('#centro').click( function() {
$.ajax({
        url: 'request.php',
        type:'POST',
        data: $("#form").serialize(),
        dataType: 'json',
        success: function(output_string){
        alert(output_string);
                $('#cuentas').html(output_string);
            } // End of success function of ajax form
        }); // End of ajax call    

  });

});
</script>

HTML：

  <?php
  $result = 'works';
  ?>

  <form id="form">
  <div id="centro">
  <a href="#">Click here</a>
  <br>
  <input type="hidden" name="centro" value="<?php echo $result; ?>">
  </form>

  <div id="cuentas">
  </div>

PHP 文件，request.php

 <?php
 $centro = $_POST['centro'];
 $output_string = ''.$centro;
 echo json_encode($output_string);
 ?>
4

3 回答 3

0

尝试更改您的代码有点像下面。

jQuery部分 

success: function(d){
         var output=d[0].data; // Will output only first record  
          $('#cuentas').html(output);
        } // End of success function of ajax form

PHP部分

$centro = $_POST['centro'];
$output_string = array('data'=>$centro);
echo json_encode($output_string);

如果仍然无法正常工作，请检查Developer toolchrome 或firebugfirefox 以监控请求

于 2013-05-01T18:25:51.880 回答
0

查看您的代码：

  <?php
  $result = 'works';
  ?>

  <form id="form">
  <div id="centro">
  <a href="#">Click here</a>
  <br>
  <input type="hidden" name="centro" value="<?php echo $result; ?>">
  </form>

  <div id="cuentas">
  </div>

我错过了 div id="centro" 的结束标签。因此 jQuery("#centro") 的点击事件不会触发。

我想它应该是这样的：（总是在 div 的内部或外部设置<form>，</form>不要混合并放在div 的<form>外部和</form>内部。当你做这样的混合时，有些事情不会按预期工作。

  <?php
  $result = 'works';
  ?>

  <div id="centro">
  <form id="form">
  <a href="#">Click here</a>
  <br>
  <input type="hidden" name="centro" value="<?php echo $result; ?>">
  </form>
  </div> ><!-- end of div centro -->

  <div id="cuentas">
  </div>
于 2013-05-01T18:29:15.297 回答
0

我解决了，现在可以了，而且我添加了一个 gif 加载器：

Javascript：

 <script>
 jQuery(document).ready(function() {
 jQuery('#centro').click( function() {
 var result = $("input#centro").val(); 
 $.ajax({
    url: 'request.php',
    type:'POST',
    data: { 'dataString': result },
    beforeSend: function(){
                   $("#loader").show();
               },
    success: function(output_string){
     $("#loader").hide();
           $('#cuentas').html(output_string);  
        } // End of success function of ajax form
    }); // End of ajax call    

  });

 });
 </script>

HTML

 <?php
 $result = 'works';
 ?>

 <form id="form">
 <div id="centro">
 <div id="loader" style="display:none"><img src="ajax-loader.gif" width="20px" height="20px"></div>
 <a href="#">Click here</a> 
 <br>
 <input type="hidden" name="centro" id="centro" value="<?php echo $result; ?>">
 </form>
<div id="cuentas">
</div>

PHP

 <?php
 $data = $_POST['dataString'];
 $output_string = '';
 $output_string = '<h3>'.$data.' '.'testing'.'</h3>';
 echo $output_string;
 ?>

输出：“工作测试”

于 2013-05-01T21:19:41.043 回答