在提交按钮后使用javascript处理php中的div标签可见性

问题描述：

In this code when I select option 3 value my business div will be visible(For option 1 and 2 value it will be hidden) but after submitting button the business div not visible.so, please help me to solve it.

HTML code

    <form method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>"

<table width="30%" border="1px solid white"><tr border="1px solid white">
<td><select id='purpose' name="purpose" style="color:black">

            <option value="1" <?php echo $d1 ?>>Current Day</option>
            <option value="2" <?php echo $d2 ?>>Current Month</option>
            <option value="3" <?php echo $d3 ?>>Custom</option>
    </select></td></tr></table></br>
    <div style='display:none;' id='business'>

    <table width="50%"><tr> <td width="50%">Start Date<input style="color:black;background-color:white;" type="text" id="basic_example_1" name="stdt" placeholder="YYYY-MM-DD HH:MM"/>


            </td>
    <td >End Date<input style="color:black;background-color:white;" type="text" id="basic_example_3" name="spdt" placeholder="YYYY-MM-DD HH:MM"/>

            </td></tr></table>
    </div>

    <button type="submit" name="table"  value="reg" class="btn btn-success" style="width:20%;height:35px;margin-top:5px" >Submit</button>

        </form>

Javascript code

<script>

$(document).ready(function(){

      $('#purpose').on('change', function() {
      if ( this.value == '3')
      {
        $("#business").show();


      }
      else if(this.value == '2')
      {
        $("#business").hide();
      }
      else if(this.value == '1')
      {
                  $("#business").hide();

      }
    });


});


   </script>

在此代码中，当我选择选项3值时，我的业务div将可见（对于选项1和2值，它将隐藏）但提交按钮后业务div不可见。所以，请帮我解决。 p>

HTML代码 p>

 ＆lt; form method =“get”action =“＆lt;？php echo $ _SERVER ['PHP_SELF']  ;？＆gt;“
 
＆lt; table width =”30％“border =”1px solid white“＆gt;＆lt; tr border =”1px solid white“＆gt; 
＆lt; td＆gt;＆lt; select id ='用途 'name =“purpose”style =“color：black”＆gt; 
 
＆lt; option value =“1”＆lt;？php echo $ d1？＆gt;＆gt;当前日＆lt; / option＆gt; 
＆lt;选项 value =“2”＆lt;？php echo $ d2？＆gt;＆gt;当前月＆lt; /选项＆gt; 
＆lt; option value =“3”＆lt;？php echo $ d3？＆gt;＆gt;自定义＆lt; /选项＆gt;  
＆lt; / select＆gt;＆lt; / td＆gt;＆lt; / tr＆gt;＆lt; / table＆gt;＆lt; / br＆gt; 
＆lt; div style ='display：none;'  id ='business'＆gt; 
 
＆lt; table width =“50％”＆gt;＆lt; tr＆gt;  ＆lt; td width =“50％”＆gt;开始日期＆lt; input style =“color：black; background-color：white;”  type =“text”id =“basic_example_1”name =“stdt”placeholder =“YYYY-MM-DD HH：MM”/＆gt; 
 
 
＆lt; / td＆gt; 
＆lt; td＆gt;结束日期＆lt;  ;输入样式=“颜色：黑色;背景颜色：白色;”  type =“text”id =“basic_example_3”name =“spdt”placeholder =“YYYY-MM-DD HH：MM”/＆gt; 
 
＆lt; / td＆gt;＆lt; / tr＆gt;＆lt; / table＆gt; \  n＆lt; / div＆gt; 
 
＆lt; button type =“submit”name =“table”value =“reg”class =“btn btn-success”style =“width：20％; height：35px; margin- 顶部：5px“＆gt;提交＆lt; /按钮＆gt; 
 
＆lt; / form＆gt; 
  code>  pre> 
 
  Javascript代码 p> 
 
 
  ＆lt; script＆gt; 
 
 $（document）.ready（function（）{
 
 $（'＃purpose'）。on（'change'，function（）{
 if（this。  value =='3'）
 {
 $（“＃business”）。show（）; 
 
 
} 
否则if（this.value =='2'）
 {
  $（“＃business”）。hide（）; 
} 
 else if（this.value =='1'）
 {
 $（“＃business”）。hide（）; 
 
  } 
}）; 
 
 
}）; 
 
 
＆lt; / script＆gt;  
  code>  pre> 
  div>

答

Try this code.

 <?php
        $DispDiv ="display:none;";

        if(isset($_GET['purpose']) && ($_GET['purpose'] == 3)){
            $DispDiv ="display:block;";         
        }

    ?>

        <form method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>" <table width="30%" border="1px solid white">
            <tr border="1px solid white">
                <td>
                    <select id='purpose' name="purpose" style="color:black">

                        <option value="1" <?php echo $d1 ?>>Current Day</option>
                        <option value="2" <?php echo $d2 ?>>Current Month</option>
                        <option value="3" <?php echo $d3 ?>>Custom</option>
                    </select>
                </td>
            </tr>
            </table>
            </br>

            <div style='<?php echo $DispDiv;?>' id='business'>

                <table width="50%">
                    <tr>
                        <td width="50%">Start Date
                            <input style="color:black;background-color:white;" type="text" id="basic_example_1" name="stdt" placeholder="YYYY-MM-DD HH:MM" />

                        </td>
                        <td>End Date
                            <input style="color:black;background-color:white;" type="text" id="basic_example_3" name="spdt" placeholder="YYYY-MM-DD HH:MM" />

                        </td>
                    </tr>
                </table>
            </div>

            <button type="submit" name="table" value="reg" class="btn btn-success" style="width:20%;height:35px;margin-top:5px">Submit</button>

        </form>
        <script>
            jQuery(document).ready(function($) {

                $('#purpose').on('change', function() {
                    if (this.value == '3') {
                        $("#business").show();

                    } else if (this.value == '2') {
                        $("#business").hide();
                    } else if (this.value == '1') {
                        $("#business").hide();

                    }
                });

            });
        </script>

答

Once you submit the form, the change event of #purpose will get triggered and based on the script you wrote, it will get hidden.

在提交按钮后使用javascript处理php中的div标签可见性

相关推荐