0

HTML:

<table border="1">
    <tr id="main_account">
        <td width="50%">
            <h3 style="margin-left:10px">Details</h3> 
            <table width="270">
                <tr>
                    <td>First name:</td>
                    <td><input type="text" name="first_name" id="id_first_name" /></td>
                </tr>
                <tr>
                    <td>Last name:</td>
                    <td><input type="text" name="last_name" id="id_last_name" /></td>
                </tr>
                <!-- other html -->
            </table>
        </td>
    </tr>
    <tr id="authorised_reporter">
        <td  width="100%" colspan="2">                            
            <form method="post" action="." id="reporter-form">                                    
                <table  width="100%">
                    <tr>
                        <td style="width:100px;">First name:</td>
                        <td><input type="text" name="first_name" id="id_first_name" /> </td>
                    </tr>
                    <tr>
                        <td>Last name:</td>
                        <td><input type="text" name="last_name" id="id_last_name" /> </td>
                    </tr>
                    <tr>
                        <td>Daytime phone:</td>
                        <td><input id="id_phone_daytime" type="text" class="trim-space" name="phone_daytime" /></td>
                    </tr>
                </table>
            </form>
        </td>
    </tr> 
</table> 

onpage load id #main_account 已显示,id #authorised_reporter 已隐藏。如果单击 #authorised_reporter #authorised_reporter 处于显示块中,而 #main_account 处于显示无状态。在 #authorised_reporter 选项卡中,我正在使用 ajax 更新用户数据,在成功调用后我正在重新加载页面。由于 onload 我在重新加载后默认显示#main_acount,它会将我带到#main_account,但我需要的是在 pagereload 上成功调用 ajax 之后,页面应该显示#authorised_reporter 选项卡而不是#main_account 选项卡。

我尝试了以下但不工作,带我去#main_account

//other code not shown
success: function() {  
    location.reload();
    $('#authorised_reporter').css("display", "block");
    $('#main_account').css("display", "none");
    $("#sucess").show();
    $("#sucess").text("Changes has been updated."); 
}    
4

2 回答 2

0

尝试以下方法:

示例:1

$("#main_account").hide();  

如果答案与您无关,请忽略它。


示例:2

要获得优雅的降级,您可以坚持通过 jQuery 完成隐藏,只需给编辑<tr>行一个类,例如,<tr class="edit">然后在表外使用 jQuery 一次隐藏所有这些,如下所示:

<script type="text/javascript">
$(function() {
    $("tr #main_account").hide();
});
</script>

这种方法不是用 CSS 将它们隐藏起来,而是对那些禁用 JS 的人更友好,如果您可能有这样的用户受众,请采用这种.hide()方法。

于 2013-09-20T10:20:17.040 回答
0

您的更改可能不适用,因为,

location.reload();

它将重新加载内容,成功功能的后期部分将不起作用。如果您可以更具体并提供更多html,将能够给您答案。您也可以在 jQuery中使用.done() 。

于 2013-09-20T10:26:13.407 回答