jquery - jQuery ajax 成功回调后，CSS 可见性属性在 Webkit 浏览器上不起作用

Question

问题:
我通过单击一些光标图像来进行 jQuery .ajax 调用，以便浏览图书目录，用 ajax 响应(纯 html)替换 div 的内容。有一个光标图像，仅在该书有超过 1 张图片时显示，该图像由 php 代码控制，该代码直接呈现 ajax 回调中给出的 HTML。

在 FF 和 IE > 7 中，脚本可以正常工作。但在 Webkit 浏览器中，ajax 回调做得很好，但它无法正确渲染 CSS。似乎右侧的光标图像在第一次显示后就被缓存了，即使这本书可能没有任何额外的图像。有趣的是，显示了正确的光标图像，但 JS 功能不起作用(因为没有额外的图像，所以应该如此)，而且还因为当您使用在 Chrome 中打开的开发人员工具进行导航时，CSS 呈现得很好，因为它应该是这样，就像在 FF 和 IE7 中一样。

可能是$(document).ready使用错误的问题？

这是作为外部 .js 文件插入的 JS 代码:

function goBook(val, dir, lang){
    var direction = '';
    var inverse = '';
    if(dir == 'down'){
         direction = '+';
         inverse = '-';
    }else{
         direction = '-';
         inverse = '+';
    }
    $(document).ready(function(){
         $("div.itemlateral").animate({'top': inverse+"500px"});
         $.ajax({
             url: "projects",
             type: "POST",
             data: { book: val, pic: 0, language: lang },
             dataType: "json",
             success: function(data){
                 $("div.inner-content").html(data.projects);
                 $("div.itemlateral").css({'top': direction+"1000px"});
                 $("div.itemlateral").animate({'top': "0px"});
                 }
             });
         });
     }
}

function nextImg(val, val2, dir, lang){
    var direction = '';
    var inverse = '';
    if(dir == 'right'){
        direction = '+';
        inverse = '-';
    }else{
        direction = '-';
        inverse = '+';
    }
    $(document).ready(function(){
        $("div.node-image").animate({'left': inverse+"500px"});
        $.ajax({
            url: "projects",
            type: "POST",
            data: { book: val, pic: val2, language: lang },
            dataType: "json",
            success: function(data){
                         $("div.inner-content").html(data.projects);
                         $("div.node-image").css({'left': direction+"1000px"});
                         $("div.node-image").animate({'left': "0px"});
                      }
            });
     });
}

Answer 1

经过一些测试，我想说这与 javascript 无关，而是 webkit 中一个实际模糊的重绘行为错误。

我这么说的原因是，一旦您强制文档重绘(按 ctrl+a 或调整窗口大小，或者正如您所说的在开发模式下自动重绘文档)，箭头就会消失。

我做了一些测试，并在您的 .disabled [style.css] 类中将 visibility: hide; 替换为 display: none; 似乎解决问题。