ios5 - 替代样式表不适用于 iOS5

Question

我有一个使用备用样式表的网站，并且在使用 iOS4 的 iPad 上进行了查找。然而，这并没有被运行 iOS5 的 iPad 调用。我还找到了那个网站 http://css-tricks.com/examples/AlternateStyleSheets/在运行 iOS4 的 iPad 上运行正常，但在运行 iOS5 的 iPad 上运行不正常，是否表明这可能是浏览器问题？

我的网站有以下片段

<link rel="alternate stylesheet" id="smallScr" title="smallScr" type="text/css" href="/style/smallscreen.style.css" />
<link rel="alternate stylesheet" id="microScr" title="microScr" type="text/css" href="/style/microscreen.style.css" />
.
.
var varDevice = 'iPad';
alert('detected small (ipad) screen device = ' + screen.width + ' x ' + screen.height);
setActiveStyleSheet('smallScr');

在这两种情况下都会调用警报，但我的备用工作表未应用于运行 iOS5 的 iPad。

有没有人遇到过这个问题并有解决方案

谢谢

罗布

Answer 1

我遇到了同样的问题。 ios4 或任何其他浏览器，交换样式表没问题，但 ios5 根本不起作用。它会加载默认样式表，然后当它切换到备用样式表时，不会有任何样式表处于事件状态。经过反复试验，我得到了以下对我有用的东西。效率不高，但似乎确实有效。

将 $('link[rel*=stylesheet]').each 更改为 $('link').each，并且 this.disabled = false 到 $(this).attr( 'disabled', false ); 似乎有所不同。

<link rel="stylesheet" type="text/css" href="style.css" title="style" media="screen" />
<link rel="alternate stylesheet" type="text/css" href="style2.css" title="style2" media="screen" />


var availableStylesheets = [ "style", "style2" ];

function stylesheetSwitch( styleName )
{
$('link').each( function() {
    var inStyles = false;
    for( var i=0; i < availableStylesheets.length; i++){
        if( $(this).attr('title') == availableStylesheets[i] ){
            inStyles = true;
        }
    }
    if(inStyles){
        $(this).attr( 'disabled', true );
        if ($(this).attr('title') == styleName) {
            $(this).attr( 'disabled', false );
        }
    }
}); 
}