Question

我有一个页面，我需要为某些元素添加拖放功能。当drop事件发生时，它会对php函数进行ajax调用，然后刷新div的内容。我使用jQuery和jQueryUI进行拖放，而CakePHP作为PHP框架（不确定这是否相关）。

在Firefox，Safari甚至IE中，一切都运行良好，但在Opera或Chrome中，div的内容不会刷新（尽管执行了PHP函数的操作）。

所以，这是代码：

jQuery('#lists div').
    filter(function() {return this.id.match(/item[\d]+_[\d]+/);}).
    each(function() { jQuery(this).draggable( {axis: 'y'}); });

jQuery('#lists div').
    filter(function() {
        return this.id.match(/list[\d]+/);}).
               each(function() { 
                   jQuery(this).droppable({
                      drop: function(event, ui) {
                            dropID = jQuery(event.target).attr('id');
                            dragID = jQuery(ui.draggable).attr('id');

                            itemID = dragID.substr(dragID.lastIndexOf('_') + 1);
                            oldListID = dragID.substr(4).replace(/_[\d]+/g, '');
                            newListID = drop.substr(4);

                            jQuery.ajax({
                                url:  "/lists/itemToList/"+itemID+"/"+oldListID+
                                      "/"+newListID,
                                type: "POST",
                                success: function (data) {
                                     jQuery('#lists').html(data);}
                            });
                         }
                 });
    });

基本上，成功函数没有被执行，但是如果我试图看到errorThrown（在错误事件上）它是“未定义的”

Answer 1

尝试这样的事情：

jQuery.ajax({
   url:  "/lists/itemToList/"+itemID+"/"+oldListID+
      "/"+newListID,
   type: "POST",
   success: function (data) {
      jQuery('#lists').html(data);
   }
   error: function (XMLHttpRequest, textStatus, errorThrown) {
      alert(XMLHttpRequest.status);
      alert(XMLHttpRequest.responseText);
   }
});

它会显示您为您的请求获得的http响应。前段时间我遇到了同样的问题。我的脚本在Firefox和Chrome中运行得很好，但它在Opera和IE中没有做任何事情。我查了一下，问题是，php后端返回404（我仍然不知道它是如何在Chrome和FF下工作的。）

Answer 2

我知道自从我发布问题以来已经很长时间了，但是我发现这是解决方案，以防其他人需要它：问题不是在javascript中而是使用CakePHP：html那个成功添加包含ajax表单（使用$ ajax-＆gt; form（）呈现）。 $ ajax-＆gt; form（）需要来自控制器的$ data变量是一个数组，但由于某种原因它不是，这打破了表单的渲染，Opera和Chrome不喜欢这样。所以解决方案就是简单地添加

$this->data = array();

到我的控制器中的itemToList（）函数。

Answer 3

我在代码中看不到会导致跨浏览器问题的任何内容。我的感觉是，问题根本不在于代码，而是在Chrome和Opera中渲染div和/或其内容（即CSS问题或innerHTML行中的某些内容div的更新，但由于样式或定位，你没有得到你正在寻找的视觉效果）。

您是否已使用Dragonfly或其他一些开发人员工具进行检查，以确认在成功请求后目标元素的内容实际上未更改？你是否试过在问题浏览器中逐步执行代码执行？您还可以尝试向error选项添加JQuery.ajax处理程序，以查看请求本身是否存在问题，但我不相信问题所在。

编辑：我没有在代码块下面看到最后一位。因此，您已验证成功处理程序未被执行。您说您确实尝试为请求实现错误处理程序并得到一些未定义的结果，但我在代码中没有看到它。你可以发布错误处理程序的代码并描述错误中未定义的内容吗？

Answer 4

我认为他的意思是，警报（errorThrown）显示'未定义'。

Opera和Google Chrome中的jquery ajax问题

4 个答案: