Javascript 当我提交表单时，它不会返回到PHP中的同一选项卡_Javascript_Php_Css_Html

Javascript 当我提交表单时，它不会返回到PHP中的同一选项卡

javascript php css html

Javascript 当我提交表单时，它不会返回到PHP中的同一选项卡,javascript,php,css,html,Javascript,Php,Css,Html,我的PHP页面中有不同的选项卡。我在每个标签上都有表格。现在我想提交表格。但当我提交表单时，它将进入第一个选项卡。我只是希望它将保持在提交位置的同一选项卡上，但它永远不会。请帮帮我，代码如下所示 <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.js"></script> <script type

我的PHP页面中有不同的选项卡。我在每个标签上都有表格。现在我想提交表格。但当我提交表单时，它将进入第一个选项卡。我只是希望它将保持在提交位置的同一选项卡上，但它永远不会。请帮帮我，代码如下所示

   <html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.js"></script>
    <script type="text/javascript">
        $(function(){
            $("#tab-container").on("click", ".tab-lbl", function(){
                var that = $(this);
                var tabid = that.data("tab");

                $(".tab").each(function(k, v){
                    $(this).hide();
                });

                $(tabid).show();
            });
        });
    </script>
</head>

<body>

<div id="header">
    <div class="logo"><a href="#"><span>TAJWEED</span></a></div>
</div>

<div id="container">
   <div class="sidebar">
       <div id="nav">
       <ul id="tab-container">
        <li><a href="#" class="selected tab-lbl" data-tab="#tab-dashboard">Dashboard</a></li>
        <li><a href="#" class="tab-lbl" data-tab="#tab-menu">Menue</a></li>
        <li><a href="#" class="tab-lbl" data-tab="#tab-slider">Slider</a></li>
        <li><a href="#" class="tab-lbl" data-tab="#tab-gallery">Gallery</a></li>
        <li><a href="#" class="tab-lbl" data-tab="#tab-pictures">Pictures</a></li>

       </ul>

       </div>

   </div>
   <div class="content">

        <div id="tab-menu" class="tab" style="display: none;">

  <?php

$connection = new mysqli('localhost','root','','Tajweed');// Establishing Connection with Server

if(isset($_POST['submitv'])){ // Fetching variables of the form which travels in URL
$name = $_POST['pname'];
$email = $_POST['plink'];


//Insert Query of SQL
$sql=$connection->query("INSERT INTO main_page(pname, plink) values ('$name', '$email')");



}
?>

<form name="myForm" action="admin.php" method="POST" onsubmit=" return validateForm()" >
Page Name: <input  placeholder="page name :" name="pname" type="text"  />
Page Link: <input type="text" placeholder="Page Link :" name="plink" />
<input type="submit" value="submit"  name="submitv">
</form>






</div>
        <div id="tab-slider" class="tab" style="display: none;">


  <?php

$connection = new mysqli('localhost','root','','Tajweed');// Establishing Connection with Server

if(isset($_POST['submitv'])){ // Fetching variables of the form which travels in URL
$name = $_POST['pname'];
$email = $_POST['plink'];


//Insert Query of SQL
$sql=$connection->query("INSERT INTO main_page(pname, plink) values ('$name', '$email')");



}
?>

<form name="myForm" action="admin.php" method="POST" onsubmit=" return validateForm()" >
Page Name: <input  placeholder="page name :" name="pname" type="text"  />
Page Link: <input type="text" placeholder="Page Link :" name="plink" />
<input type="submit" value="submit"  name="submitv">
</form>






</div>
        <div id="tab-gallery" class="tab" style="display: none;"><h1>Gallery</h1></div>
        <div id="tab-pictures" class="tab" style="display: none;"><h1>Pictures</h1></div>
</div>

</body>
</html>
</div>


$（函数（）{
$（“#制表符容器”）。在（“单击”，“制表符lbl”，函数（）上{
var，该值=$（此值）；
var tabid=该.data（“tab”）；
$（“.tab”）。每个（函数（k，v）{
$（this.hide（）；
});
$（tabid.show（）；
});
});







将id添加到链接：
<li><a id="tab1" href="#" class="tab-lbl" data-tab="#tab-menu">Menue</a></li>



将新隐藏变量添加到窗体：
<form name="myForm" action="admin.php" method="POST" onsubmit=" return validateForm()" >
Page Name: <input  placeholder="page name :" name="pname" type="text"  />
Page Link: <input type="text" placeholder="Page Link :" name="plink" />
<input type="hidden" name="link" value="tab1">
<input type="submit" value="submit"  name="submitv">
</form>


页面名称：
页面链接：

添加js代码：
<?php if(isset($_POST['link'])): ?>
$(document).ready(function(){
$("#<?php echo $_POST['link']?>").click();
});
<?php endif; ?>


$（文档）.ready（函数（）{
$（“#”）点击（）；
});



$（函数（）{
$（“#制表符容器”）。在（“单击”，“制表符lbl”，函数（）上{
var，该值=$（此值）；
var tabid=该.data（“tab”）；
$（“.tab”）。每个（函数（k，v）{
$（this.hide（）；
});
$（tabid.show（）；
});
});
$（文档）.ready（函数（）{
$（“#”）点击（）；
});





表格1：
页面名称：
页面链接：
表格2：
页面名称：
页面链接：
顺便说一句，您的sql极有可能被注入。使用PDO。为此，您需要使用ajax。试着用谷歌搜索一下。关于stackoverflow的例子已经足够多了。你的意思是，如果当前选项卡是第三个，并且你提交了表单，它会“移动”到第一个选项卡吗？它会在一个新标签页中打开，然后先“开始”吗？你的确切意思是什么？当我在第三个选项卡中提交表单时，在提交之后，它会作为一个选项卡转到默认选项卡。但我希望它将保留在我提交表单的第三个选项卡上。我只是希望选项卡与表单提交的位置保持一致，而不是进入默认选项卡。您需要在这里使用AJAX，在不重新加载页面的情况下提交表单。因为它正在重新加载页面，所以您的活动选项卡可见（第一个选项卡）。我使用此代码，但它给出的响应与返回到默认选项卡的响应相同。这个代码不起作用：-（谢谢你）亚历山大：但是想想Abhishek Dhanraj Shahdeo写的是什么。在这种情况下，最好使用AJAX，或
<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.js"></script>
    <script type="text/javascript">
        $(function(){
            $("#tab-container").on("click", ".tab-lbl", function(){
                var that = $(this);
                var tabid = that.data("tab");

                $(".tab").each(function(k, v){
                    $(this).hide();
                });

                $(tabid).show();
            });
        });

        <?php if(isset($_POST['link'])): ?>
        $(document).ready(function(){
        $("#<?php echo $_POST['link']?>").click();
        });
        <?php endif; ?>
    </script>
</head>
<body>
<div id="header">
<div class="logo"><a href="#"><span>TAJWEED</span></a></div>
</div>
<div id="container">
<div class="sidebar">
<div id="nav">
<ul id="tab-container">
<li><a href="#" class="selected tab-lbl" data-tab="#tab-dashboard">Dashboard</a></li>
<li><a href="#" id="tab1" class="tab-lbl" data-tab="#tab-menu">Menue</a></li>
<li><a href="#" id="tab2" class="tab-lbl" data-tab="#tab-slider">Slider</a></li>
</ul>
</div>
</div>
<div class="content">
<div id="tab-menu" class="tab" style="display: none;">
<form name="myForm" action="admin.php" method="POST" onsubmit=" return validateForm()" >Form1:
Page Name: <input  placeholder="page name :" name="pname" type="text"  />
Page Link: <input type="text" placeholder="Page Link :" name="plink" />
<input type="hidden" name="link" value="tab1">
<input type="submit" value="submit"  name="submitv">
</form>
</div>
<div id="tab-slider" class="tab" style="display: none;">Form2:
<form name="myForm" action="admin.php" method="POST" onsubmit=" return validateForm()" >
Page Name: <input  placeholder="page name :" name="pname" type="text"  />
Page Link: <input type="text" placeholder="Page Link :" name="plink" />
<input type="hidden" name="link" value="tab2">
<input type="submit" value="submit"  name="submitv">
</form>
</body>
</html>