jquery - 使用 jQuery 通过单击链接取消隐藏 div

Question

为此，我使用 colorbox jQuery 插件 http://colorpowered.com/colorbox/和一个表格。我正在尝试使用 jQuery colorbox 取消隐藏包含表单的 div ，并在单击下面的相关链接时将其显示在 colorbox 中。

这是我使用的 header 中的 javascript:

$(document).ready(function() {
    $('#password_reset').ajaxForm({
        success: showResponse,
        clearForm: 'true'
    });

    function showResponse(responseText, statusText) {
        $('#password_reset').hide();
        $('#formStatus').html(responseText);
    };

    $().bind('cbox_open', function() {
        $('#password_reset').show();
        $('#formStatus').html('');
    });

    $(".inline").colorbox({
        width: "300px",
        height: "250px",
        inline: true,
        href: "#password_change"
    });
});

这是我拥有的链接，应该运行我的 javascript 代码(上面)并取消隐藏下面的 div 并将其运行到 colorbox 中:

<a href="javascript:showResponse">Password Reset</a>

这是我隐藏的 div:

<div style="visibility: hidden;">
    <div id='password_change' style="padding:10px; background:#fff;">
        <strong>Change your password</strong><br /><br />
        <form id="password_reset" action="password_reset.php" method="post">
            <input type="hidden" name="Method" value="updatePassword"  />
            Password: <br />
            <input type="password" name="password1" />
            <br />
            <br />
            Verify Password: <br />
            <input type="password" name="password2" />
            <br />
            <input type="submit" value="Update" />
        </form>
        <div id="formStatus"></div>
    </div>
</div>

希望有人能告诉我如何让它工作，因为我完全陷入困境，我知道这是我在这里犯的一个小错误，但我无法弄清楚。请帮忙？

Answer 1

griegs' answer已经到一半了。 jQuery 在 div 元素上的显示和隐藏相当于 display:block;并显示:无；所以应该是这样的:

<div id="DIV_password_reset" style="display:none;">

$('#DIV_password_reset').show();

如果您想使用可见性，请执行以下操作:

<div id="DIV_password_reset" style="visibility:hidden;">

$('#DIV_password_reset').css('visibility', 'visible');