Question

我的网站建设存在问题。

该网站的一个特点是要求提供信息的调查。一类问题是视觉选择问题＆＃39;显示可以单击的图像。这些图像对应于（隐藏）复选框，这些复选框记录了他们的答案。选中的项目将被赋予边框，这为我们的用户带来了良好的视觉体验。

然而，IE8中的用户无法点击图片 - 标签内的<img>个标签在IE8中无法点击，:checked CSS选择器不可用。我们的利益相关者很好，IE8的体验有所降低，但它必须适合他们。

为了让IE8的体验优雅地降级，我将调查包装在一个仅限IE8的div中（使用条件注释，这样只有IE8及以下才能得到它）并写了一行或两行CSS，以便复选框可见。

不幸的是，复选框位于浮动元素之外，因此距离元素的位置非常远。

我写了一些jQuery，它会分离复选框并在浮动元素中重新附加它们。我将这个jQuery包装在相同类型的条件注释中，在IE11的开发人员工具栏启用的IE8模式下测试它，并将代码推送到服务器。

它在真正的IE8上失败了。代码，包括用条件注释包装的jQuery，可以在IE11模拟的IE8上运行，但不适用于真正的IE8。

我该怎么做才能解决这个问题？

这里是jsFiddle，其中显示了调查问题的简化版本。 javascript面板中的代码包含在最终页面上的<!--[if lte IE 8]>标记中。

Answer 1

使用所有这些条件黑客攻击使解决方案过于复杂。

您需要做的就是解决您在IE8中面临的一个问题，它不支持点击标签。

您只需将标签的click事件直接绑定到输入本身即可。

这应该可以满足您的需求（在加载jQuery之后包含它）。

<!--[if lte IE 8]>
<script type="text/javascript">
$(function () {
    $("label").click(function(){
        if ($(this).attr("for") != "")
            $("#" + $(this).attr("for")).click();
    });
});
</script>
<![endif]-->

重要提示：确保标签上的for=""与您输入的id=""相符。

JQuery没有在IE8中运行

1 个答案: