2
我有几个选项卡，每次我选择一个选项卡时，表单被提交发送变量一个不同的值（从用户隐藏）。如果我从TAB1到TAB2说，变量99将得到2的值，TAB3的值为3，依此类推....问题我遇到的是当我选择TAB2时，我不希望页面恢复到TAB1。这里是我的代码：如何防止提交表单后恢复到以前的选项卡
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Submit a Form on Tab Click</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<style type="text/css">
</style>
<script>
$(function() {
$("#Main").tabs();
$('[id^=ui-id-]').click(function(){
var tabId = $(this).attr('id');
var tabNum = tabId.split('-')[2];
$('#form-' + tabNum).submit();
});
});
</script>
</head>
<body>
<div id="Main">
<ul>
<li><a href="#Tab1">Tab1</a></li>
<li><a href="#Tab2">Tab2</a></li>
<li><a href="#Tab3">Tab3</a></li>
<li><a href="#Tab4">Tab4</a></li>
<li><a href="#Tab5">Tab5</a></li>
<li><a href="#Tab6">Tab6</a></li>
</ul>
<form id="form-1" action="Tab_Click_v00.html" method="post">
<input type="hidden" name="Nb_var99" value="1">
</form>
<form id="form-2" action="Tab_Click_v00.html" method="post">
<input type="hidden" name="Nb_var99" value="2">
</form>
<form id="form-3" action="Tab_Click_v00.html" method="post">
<input type="hidden" name="Nb_var99" value="3">
</form>
<form id="form-4" action="Tab_Click_v00.html" method="post">
<input type="hidden" name="Nb_var99" value="4">
</form>
<form id="form-5" action="Tab_Click_v00.html" method="post">
<input type="hidden" name="Nb_var99" value="5">
</form>
<form id="form-6" action="Tab_Click_v00.html" method="post">
<input type="hidden" name="Nb_var99" value="6">
</form>
<div id="Tab1">
<p>Tab1</p>
</div>
<div id="Tab2">
<p>Tab2</p>
</div>
<div id="Tab3">
<p>Tab3</p>
</div>
<div id="Tab4">
<p>Tab4</p>
</div>
<div id="Tab5">
<p>Tab5</p>
</div>
<div id="Tab6">
<p>Tab6</p>
</div>
</div>
</body>
</html>
这里是我的代码现在，我删除了一些东西，这并没有使自从：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Submit a Form on Tab Click</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<style type="text/css">
</style>
<script>
$(function() {//Open function
$("#Main").tabs();
$('[id^=ui-id-]').click(function(){ //Open [id^=ui-id-]
if (tabId == 'ui-id-1')
{
doAjax('1');
}
else if (tabId == 'ui-id-2')
{
doAjax('2');
}
else if (tabId == 'ui-id-3')
{
doAjax('3');
}
function doAjaxSubmit(formID) { //Open doAjaxSubmin
$.ajax({
type: "POST",
url: "Tab_Click_v00.html",
data: "Nb_var99=" + formID,
})
} //Close doAjaxSubmin
}); //Close [id^=ui-id-]
});//Close function
</script>
</head>
<body>
<div id="Main">
<ul>
<li><a href="#Tab1">Tab1</a></li>
<li><a href="#Tab2">Tab2</a></li>
<li><a href="#Tab3">Tab3</a></li>
<li><a href="#Tab4">Tab4</a></li>
<li><a href="#Tab5">Tab5</a></li>
<li><a href="#Tab6">Tab6</a></li>
</ul>
<div id="Tab1">
<p>Tab1</p>
</div>
<div id="Tab2">
<p>Tab2</p>
</div>
<div id="Tab3">
<p>Tab3</p>
</div>
<div id="Tab4">
<p>Tab4</p>
</div>
<div id="Tab5">
<p>Tab5</p>
</div>
<div id="Tab6">
<p>Tab6</p>
</div>
</div>
</body>
</html>
这是行不通的。它也杀死了CSS风格？我会继续尝试。
你介意编辑你的问题，并告诉我们一些关于Nb_var99数据到达'Tab_Click_v00.html'时会发生什么？是否有用户需要做的事情（也就是说，用户是否需要查看该页面？），或者数据（Nb_var99 == 3，Nb_var99 == 4等）到达该HTML文件后会发生什么？此外，你的服务器做PHP或ASP.NET或？ （如果我们需要添加一些服务器端代码来完成答案？） – gibberish
此外，在将Nb_var99值置于“Tab_Click_v00.html”之后，是否要更新当前页面 - 可能是使用成功的消息，或者通过显示由Tab_Click页面发回的数据（为此，我们需要知道PHP/ASP.NET的问题......这非常简单，我们只需要知道） – gibberish
嗨，gibberish，Nb_var99是一个包含在嵌入式网络服务器中的变量（这个网络服务器不行，或者至少我不知道它运行的是PHP或ASP.NET）。据我所知，它运行一个名为PINK的软件（由Netburner开发）。不幸的是，向其变量加载值的方式是在表单上执行一个帖子。他们不需要提醒用户这个动作，另一个嵌入式单元会收集这些信息作为参考，以知道用户目前在哪里。 –