0

使用以下代码：

            $('#langHref').html("Translating...").css("color","#FF9933");

            jQuery.ajax({
                type: "post"
                 , url: someUrl
                 , data: { "text": $('body').html() }
                 , async: false 
                 , success: function (data, status) {  
                     $('body').html(data);                      
                 },
                error: function () {
                    alert('We are sorry, there was an error in the translation service.');
                    //console.log("ERROR", arguments);
                }
            });

            $('#langHref').html("Select Language").css("color","");
        }

我有一个<a>id 为“langHref”的标签，这里的想法是在调用 ajax 之前，链接文本设置为“Translating...”，其颜色变为橙色。ajax 完成后，链接文本更改回标准的“选择语言”。

这在 FF 中运行良好，但在 IE 和 Chrome 中失败。我已经尝试了所有 beforeSend jQuery 选项和 ajaxSend 事件来尝试在 ajax 消失之前设置它，但无济于事。

如果我关闭 async: false ，那么显然它会立即将文本改回“选择一种语言”，而您看不到它起作用。我还尝试了 async: true 并在 beforeSend 中调用了“Translating ....”，这在我尝试过的任何浏览器中都不起作用。

想法？

4

2 回答 2

0

我认为您想将 beforeSend 添加到您的 ajax 请求中并在此处执行此操作，如下所示：

beforeSend: function ( xhr ) {
    $('#langHref').html("Translating...").css("color","#FF9933");
 }

还有一个完整的方法：

complete : function(jqXHR, textStatus) {
            $('#langHref').html("Select Language").css("color","");
},
于 2012-04-13T23:53:32.177 回答
0

可以通过将 async属性更改为true 并将最后一行放在完成的事件中来完成。像这样的东西：

            jQuery.ajax({
                type: "post"
                 , url: someUrl
                 , data: { "text": $('body').html() }
                 , async: true
                 , success: function (data, status) {  
                     $('body').html(data);                      
                 },
                error: function () {
                    alert('We are sorry, there was an error in the translation service.');
                    //console.log("ERROR", arguments);
                },
               completed:function(){
                   $('#langHref').html("Select Language").css("color","");
                },
                beforeSend:function(){
                $('#langHref').html("Translating...").css("color","#FF9933");
                 }
            });

也许正在发生的事情是在更改 UI 之前，因为 jQuery ajax 函数是异步的，它阻塞了 UI，因此无法更改。

于 2012-04-13T23:54:07.897 回答