1

以下代码是 IE 10 未正确拾取的 html 表单的头部部分。IE10 简单地忽略了 jQuery，并且显示了整个表单，即使它在 jQuery 代码中明确指示不应该这样做。此代码在 firefox/chrome/IE9/Safari 下完美运行。只是 IE10 导致了这个问题。非常感谢

<!DOCTYPE html>
<html lang="en">
<head>
    <title>company</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="css/style.css" type="text/css">   
    <script src="js/jquery-1.6.4.min.js" type="text/javascript"></script>
    <script src="js/script.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            /*Hiding the form */
            $(".1").css("display", "none");
            $(".2").css("display", "none");
            $(".3").css("display", "none");
            $(".4").css("display", "none");

            function goToByScroll(id){
                $('html,body').animate({scrollTop: $("#"+id).offset().top},'bottom');
            }

            $("input:radio[name=query-form][disabled=false]:last").attr('checked', true);

            $("input:radio[name=query-form]").click(function () {
                $(".1").css("display", "none");
                $(".2").css("display", "none");
                $(".3").css("display", "none");
                $(".4").css("display", "none");

                $("#country").click(function() {
                    $("html, body").animate({ scrollTop: $(document).height() }, "slow");
                    return false;
                });

                goToByScroll("country");
                if ($("#option1").is(":checked")) 
                    $(".1").show("fast");
                else if ($("#option2").is(":checked")) 
                    $(".2").show("fast");
                else if ($("#option3").is(":checked")) 
                    $(".3").show("fast");
                else if ($("#option4").is(":checked")) 
                    $(".4").show("fast");

            });
        });     
    </script>

    <!--[if lt IE 8]> 
        <div style='clear:both; text-align:center; position:relative;'><a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" alt="" /></a></div>  
    <![endif]-->
    <!--[if lt IE 9]>
        <script type="text/javascript" src="js/html5.js"></script>
        <link rel="stylesheet" href="css/ie.css" type="text/css" media="screen">   
    <![endif]-->
</head>

我们用这个以前的代码解决了这个问题，现在你能告诉我为什么下面的代码在 IE10 中不起作用。这与上面非常相似，但是，这次我们处理的是下拉菜单。同样，此代码在所有其他浏览器中都能完美找到。IE10 似乎真的很迂腐。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Company</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="css/style.css" type="text/css">   
    <script src="js/jquery-1.6.4.min.js" type="text/javascript"></script>
    <script src="js/script.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            /*Hiding the form */
            $(".install_download").css("display", "none");
            $(".hosted_install").css("display", "none");
            $(".reseller_install").css("display", "none");

            function goToByScroll(id){
                $('html,body').animate({scrollTop: $("#"+id).offset().top},'bottom');
            }

                goToByScroll("country");

                $(".subject_category").change(function(){

                    $(".install_Download").css("display", "none");
                    $(".hosted_install").css("display", "none");
                    $(".reseller_install").css("display", "none");

                    switch ($(".subject_category option:selected").text()) {                
                        case "General Enquiry":
                            $(".General_Enquiry").show("fast");
                            break;
                        case "Install/Download":
                            $(".install_download").show("fast");
                            goToByScroll("message");
                            break;
                        case "Hosted Install":
                            $(".hosted_install").show("fast");
                            goToByScroll("message");
                            break;
                        case "Solution Provider - Install":
                            $(".reseller_install").show("fast");
                            goToByScroll("message");
                            break;
                    }
                });
        });     
    </script>

    <!--[if lt IE 8]> 
        <div style='clear:both; text-align:center; position:relative;'><a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" alt="" /></a></div>  
    <![endif]-->
    <!--[if lt IE 9]>
        <script type="text/javascript" src="js/html5.js"></script>
        <link rel="stylesheet" href="css/ie.css" type="text/css" media="screen">   
    <![endif]-->
</head>
4

1 回答 1

3

基本上 CSS 类名称必须以下划线 (_)、破折号 (-) 或字母 (a–z) 开头，而不是您的情况下的数字，后跟任意数量的破折号、下划线、字母或数字. 有一个问题：如果第一个字符是破折号，第二个字符必须是字母或下划线，并且名称必须至少有 2 个字符长：

-?[_a-zA-Z]+[_a-zA-Z0-9-]*

以破折号或下划线开头的标识符通常保留用于特定于浏览器的扩展，如-moz-opacity.

由于包含转义的 Unicode 字符（没有人真正使用），这一切都变得更加复杂。

请注意，根据CSS 语法，以两个破折号开头的规则（例如--indent1）是无效的。但是，我很确定我已经在实践中看到了这一点。

于 2013-01-03T14:04:41.407 回答