0

这个问题只发生在 IE 中，在 Firefox 和 Chrome 上一切正常。我有一个表单，我想使用这些可爱的 iPhone 风格的 jQuery 开关。它基本上是一个样式复选框。我拥有的表格位于带有垂直滚动条的面板内。如果我单独留下复选框（没有 jQuery 样式），它们会留在面板内并与所有其他元素一起滚动。一旦复选框被设置样式，它们就会“跳出”滚动面板并沿着页面向下流动，而所有其他元素（标签和 ddl）都留在面板内。以下是应用的 jQuery 样式的代码：

<script type="text/javascript">
    $(document).ready(function () {
        $('.inOut:checkbox').iphoneStyle({
            checkedLabel: 'IN',
            uncheckedLabel: 'OUT'
        });
        $('.late:checkbox').iphoneStyle({
            checkedLabel: 'LATE',
            uncheckedLabel:'ON TIME'
        });
        $('.leaveEarly:checkbox').iphoneStyle({
            checkedLabel: 'YES',
            uncheckedLabel: 'NO'
        });
    });
</script>

表单元素进入的 asp 面板：

<asp:Panel ID="pnlDisplay" runat="server" ScrollBars="Vertical" Width="100%" Height="500px">
    <%-- Dynamically generated list goes inside this table from codebehind --%>
    <asp:Table ID="tblResults" runat="server" Width="98%" CellPadding="10">

    </asp:Table>
</asp:Panel>

最后，在代码隐藏中创建的复选框之一的示例：

CheckBox isIn = new CheckBox();
isIn.InputAttributes["class"] = "inOut";

同样，问题仅在 IE 中。有任何想法吗？（并且废弃 IE 不是一种选择，因为它在我们的办公室中被大量使用）

4

1 回答 1

0

最终，这个问题的解决方案是废弃 jQuery 复选框并使用类似的东西：ajaxControlToolKit 切换按钮扩展器。这个控件为我提供了我想要从 jQuery 解决方案中获得的所有相同功能，但仍然保留在可滚动面板内。而且由于它是一个asp控件，我可以在后面的代码中动态创建它。

CheckBox isIn = new CheckBox();
     isIn.ID = "cbIn" + dtCoverage.Rows[i]["userId"].ToString();
     isIn.Attributes.Add("onClick", "OnClickInOut (this)");

AjaxControlToolkit.ToggleButtonExtender isInExtender = new AjaxControlToolkit.ToggleButtonExtender();
     isInExtender.ID = "tbeIsIn" + dtCoverage.Rows[i]["userId"].ToString();
     isInExtender.ImageHeight = 26;
     isInExtender.ImageWidth = 60;
     isInExtender.UncheckedImageUrl = "~/Images/noBtn.jpg";
     isInExtender.CheckedImageUrl = "~/Images/yesBtn.jpg";
     isInExtender.TargetControlID = "cbIn" + dtCoverage.Rows[i]["userId"].ToString();
于 2014-04-03T13:53:14.820 回答