提交表单后如何保留当前选项卡

时间:2013-12-06 09:16:02

标签: html jquery

我的问题是,即使在提交表单或刷新页面后,我仍希望保留当前标签

我的浏览文件如下所示:

<ul class='tabs'>
        <li><a href='#tab1'>Tab 1</a></li>
        <li><a href='#tab2'>Tab 2</a></li>
    </ul>
<div id='tab1'>
        <h3>Section 1</h3>
        <p>Lorem ipsum dolor sit amet, consssectetur adipiscing elit. Donec lobortis placerat dolor id aliquet. Sed a orci in justo blandit commodo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>
            <form id="form1" action="" method="post">            
  <input id="button-1" name="" type="submit" />
</form>
    </div>
<div id='tab2'>
<a name="tab2"></a>
        <h3>Section 2</h3>
        <p>Aenean et est tortor. In pharetra pretium convallis. Mauris sollicitudin ligula non mi hendrerit varius. Fusce convallis hendrerit mauris, eu accumsan nisl aliquam eu.</p>

  <form id="form2" action="" method="post">            
  <input id="button-2" name="" type="submit" />
</form>
    </div>
<div>
<h2>RESULTS </h2>
</div>    

现在我想要在同一个标​​签中,即使在回发后我点击提交按钮..

请帮我解决这个问题..

由于

2 个答案:

答案 0 :(得分:2)

您需要使用ajax提交表单才能使用户保持在同一页面上。基本上,您需要阻止提交表单并使用ajax将请求发送到服务器。

你可以看看这里有一个很好的教程:

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

答案 1 :(得分:1)

查看ajax表单提交,使用ajax,您不会重新加载您jQuery makes it easier上的页面,并且可以像这样使用

$("#form2").ajaxForm({url: 'server.php', type: 'post'})

然后看看这个答案:

jQuery AJAX submit form