jQuery Ajax提交问题

为什么以下代码不能提取表单？它只是做一个正常的PHP职位，而不会引发任何错误...jQuery Ajax提交问题

我对此也使用blockUi，因此阻止/取消阻止。

$(document).ready(function(){ 
    $("input.update").click(function(){ 
     var str = $(this).parent().serialize(); 
     $(this).parent().parent().block({ message: "<span class=\"loading\"><img src=\"<?php echo $siteUrl ?>/admin/template/images/loading.gif\" alt=\"loading...\" /><p>Updating...</p></span>" }); 
     $.ajax({ 
      type: "POST", 
      url: "forms/update.php", 
      data: str, 
      success: function(){ 
       $("div.edit_box").unblock(); 
       $("div.edit_box").append("<span class=\"success\">This has been updated!</span>"); 
      } 
     }); 
     return false; 
    }); 
});

这是我第一次尝试使用jQuery的Ajax功能，请耐心等待。

来源

2009-09-01 phil

因为它似乎你只使用后的“成功”回调，你可以使用.post方法，这是对眼睛更容易一些。您也可以将这些块调用放入ajaxStart和ajaxStop。对我来说很整洁。

$(this).parent().parent().block对我来说似乎是错误的，我将它改为引用用于解锁的相同元素。我也正在检查PHP脚本的输出，以确保无论您正在更新是否更新了（只需从PHP回显XML，您将在控制台日志中看到它）。

$(function() { 
    // Apply click handlers to anchors 
    $("input.update").click(function(e){ 
     // Stop normal link click 
     e.preventDefault(); 

     var str = $(this).parent().serialize(); 

     // Send request 
     var action = "forms/update.php"; 
     $.post(action, {data:str}, function(xml) { 
      console.log(xml); 
      $("div.edit_box").append("<span class=\"success\">This has been updated!</span>"); 

     }) 
    }); 

    // Adds a wait indicator to any Ajax requests 
    $(document.body).ajaxStart(function() { 
     $("div.edit_box").block({ message: "<span class=\"loading\"><img src=\"<?php echo $siteUrl ?>/admin/template/images/loading.gif\" alt=\"loading...\" /><p>Updating...</p></span>" }); 

    }).ajaxStop(function() { 
     $("div.edit_box").unblock(); 
     $("div.edit_box").append("<span class=\"success\">This has been updated!</span>"); 
    }); 
});

来源

2009-09-01 22:05:24 aland

这已经完成了工作，谢谢！你有什么想法，为什么原来的脚本不工作？此外，我使用双父母，因为同一页面上有多个相同类别的框，我不希望他们全部一次更新其内容。 – phil 2009-09-02 08:19:47

我不确定，我以为这个.parent.parent的东西看起来有点奇怪，但我不知道这是不正确的。另外，我从来没有真正使用.ajax调用，所以可能会遇到一些问题。很高兴帮助！我只是自己学习ajax/php，所以它有点新。既然你说你使用的是Firebug，你可以使用console.log（$（this）.parent（）。parent（））来查看它是否真的返回你的想法..我一直使用console.log，因为我的对javascript的理解有点不稳定。 – aland 2009-09-02 13:30:09

另外，你使用FirePHP吗？它是萤火虫的延伸，可以让你从php输出到控制台！很时髦，例如 - $ firephp = FirePHP :: getInstance（true）; $ firephp-> log（$ _ SESSION，“我的php会话中发生了什么？”）; 只要确保在将PHP脚本上传到生产服务器时删除了所有这些调用！ :) – aland 2009-09-02 13:32:05

("input.update").click(function(){

应该

$("input.update").click(function(){

来源

2009-09-01 14:56:08 riotera

对不起，这里有一个错误，$实际上已经存在于脚本中，但由于某种原因没有出现在示例中。 – phil 2009-09-01 14:59:42

你使用一些工具来调试JavaScript？ – riotera 2009-09-01 15:06:23

另外，如果你想通过ajax提交表单，你可以使用submit事件或者ajax表单插件http://malsup.com/jquery/form/ – riotera 2009-09-01 15:09:43

jQuery Ajax提交问题

回答

相关问题