【问题标题】:Trouble with mootools AJAX after using Jquery Ajax使用 Jquery Ajax 后 mootools AJAX 出现问题
【发布时间】:2014-06-24 03:25:51
【问题描述】:

我对 Mootools 中的 Ajax 调用有一点疑问。 我使用 AJAX 在 Jquery 中编写了一个处理程序脚本和一个侦听器脚本,但我不知道如何转换它,因此它可以使用 mootools 而不是 Ajax。

使用带有 onclick='changePage($page, $total)' 的 html 链接标签调用该函数 这是原始的 JQuery Ajax 调用。它在 Ajax 文件中作为数组返回。 变量返回如下:

$data = array();
$data['result'] = '1';
$data['html'] = $this->result; //Returns Pagination bar with current selected page.
$data['html2'] = $this->result2; //Returns a block of HTML (result of Solr request styled with bootstrap

JQuery 版本的脚本

function changePage(page, total) {
      $.ajax({
            url: '/public/ajax.php?do=getPageView',
            type: 'POST',
            dataType: 'json',
            data: {
                page: page,
                total: total,

                //type : type
            },
            success: function(data) {
                //console.log(data.result);
                if (data.result == 1) {
                    $('#placeHolder').html(data.html);
                    $('#vrouwen').html(data.html2);
                } else if (data.status == 2) {
                    //do nothing :) - nothing has been input
                } else {
                    alert("Fout!!\n" + textStatus + "\n" + errorThrown);
                }
            },
            error: function error(jqXHR, textStatus, errorThrown) {
                alert("Fout!!\n"
                        + textStatus + "\n" + errorThrown);
            }

        });  
   };

我假定的 Mootools 版本的脚本

   function changePage(page, total) {
          var ajax = new Request({
               async: false,
                url: '/public/ajax.php?do=getPageView',
                method: 'POST',
                dataType: 'json',
                data: {
                    'page': page,
                    'total': total,

                    //type : type
                },
                onSuccess: function(data) {
                    //console.log(data.result);
                    if (data.result == 1) {
                        $('placeHolder').set('html', data.html);
                        $('vrouwen').set('html', data.html2);
                    } else if (data.status == 2) {
                        //do nothing :) - nothing has been input
                    } else {
                        //alert("Fout!!\n" + textStatus + "\n" + errorThrown);
                    }
                }


            });
                    ajax.send();  
       };

在视图中,我有一个名为 placeholder 的 div,这就是分页栏所在的位置。 html2 被插入到 id='vrouwen' 的 div 中。

希望你们能帮我解决这个问题。

---编辑--- 在与几个程序员同行进行头脑风暴后想通了。在这里发布调查结果供所有人查看。

区别在于 Jquery 和 Mootools 处理返回值的方式。

显然,当您设置 dataType:'json' 时,JQuery 将返回值作为 JSON 对象处理。 Mootools 不这样做,所以我在 onSuccess 函数中添加了以下内容:

 onSuccess: function(data) {

                    data = JSON.decode(data);
                    //console.log(data.html2);
                    if (data.result == 1) {
                        $('placeHolder').set('html', data.html);
                        $('vrouwen').set('html', data.html2);
                    } else if (data.status == 2) {
                        //do nothing :) - nothing has been input
                    } else {
                        //alert("Fout!!\n" + textStatus + "\n" + errorThrown);
                    }
                }

现在它正确地替换了 Divs。

【问题讨论】:

  • 仅供参考 MooTools 还有一个名为 Request.JSON 的类。欢迎发布您的发现作为答案。如果您有其他 MooTools 问题,请回复。
  • 不允许发布我的发现作为答案,因为如果帖子不到 8 小时,则需要 10 位代表对他们自己的帖子发表评论。
  • 您可以随时发布答案。评论是你需要声誉而不是答案。

标签: php jquery ajax mootools


【解决方案1】:

Mootool Request一个 XMLHttpRequest 包装器

onSuccess附加的方法是在请求成功完成时触发。

返回给附加处理程序的参数是responseText & responseXML

responseText - (字符串)请求返回的文本。 responseXML -(混合)来自请求的响应 XML。

Request.JSON - 自动接收的包装请求 JSON 格式的 JavaScript 对象。意味着它是为 json 请求制作的 当它接收到数据时,它会将其转换为 json 对象。

这里 onSuccess 在请求完成时触发。 这会覆盖请求成功事件的签名。

返回给附加处理程序的参数是responseJSON & responseText

responseJSON -(对象)来自远程请求的 JSON 响应对象。 responseText - (string) JSON 响应字符串。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-10-31
    • 2011-10-05
    • 1970-01-01
    • 2011-02-11
    相关资源
    最近更新 更多