页面加载时,JQuery切换不会显示

时间:2015-12-07 22:28:34

标签: javascript jquery asp.net toggle

我有UI问题来显示“ShowLink”。页面加载时淡出。从逻辑上讲,它应该在用户单击ShowLink时淡出。任何人都可以帮我修复代码中的错误吗?

<table width="100%">
    <tr>
        <td valign="top" style="padding-top: 20px;">
            <asp:Label ID="Label1" CssClass="number" runat="server" />
            <div>
                <a id="A1" href="#">Show Details</a>
            </div>
        </td>
        <td valign="top" style="padding-top: 20px;">
            <asp:Label ID="Label2" CssClass="question" runat="server" ClientIDMode="Static" />

            <div id="Div1">
            </div>
        </td>
    </tr>
</table>

<script type="text/javascript" src="/Scripts/jquery-1.7.2.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#showLink').toggle(function () {
            $('#questionDetails').load('/Reviews/Sub/ViewQuestion.aspx?id=<%= pageId %> #questionContainer');
            $('#questionDetails').fadeIn();
            $(this).text("Hide Detail...");
        },
    function () {
        $('#questionDetails').fadeOut();
        $(this).text("Show Detail...");
    }
    );
        var nmbr = $(".number");
        nmbr.parent().width(nmbr.width() + 50);
    });
</script>

2 个答案:

答案 0 :(得分:0)

尝试将代码放在#showLink点击事件

$('#showLink').click(function () {
        $('#questionDetails').load('/Reviews/Sub/ViewQuestion.aspx?id=<%= pageId %> #questionContainer');
        $('#questionDetails').fadeIn();
        $(this).text("Hide Detail...");
    },
function () {
    $('#questionDetails').fadeOut();
    $(this).text("Show Detail...");
}
);
    var nmbr = $(".number");
    nmbr.parent().width(nmbr.width() + 50);
});

答案 1 :(得分:0)

我找到了解决方案。问题不在于Code,Code绝对没问题。问题是在代码中使用的JQuery版本已过时并且切换没有 目前使用相同版本的工作。 解决方案:我们可以通过其他方式解决此问题,我尝试避免使用切换和工作find.Simply只需在基于id或文本的点击上添加if -else。