JQuery 页面加载时切换不显示

Question

我有 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>

Answer 1

尝试将代码放在#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);
});

Answer 2

我've found a solution. Issue is not with Code, Code is absolutely fine. Issue is with JQuery Version that were used in the code is outdated and toggle doesn' 目前无法使用相同版本。解决方案：我们可以通过其他方式解决此问题，我尝试避免使用切换并工作 find.Simply 只是在基于 id 或文本的点击时添加 if -else。

JQuery 页面加载时切换不显示

JQuery toggle doesn't show up when Page Loads up

javascript

asp.net

jquery

toggle