javascript - display a div based on url parameter - Stack Overflow

admin管理员组

文章数量:1026156

My website is trackschoolbus. You can see a login form at the top right. What I have set up is when a wrong input is given it redirects to home page with a parameter as ?er=1 i.e. /?er=1. I need to display a error message when the error url es so I have written

<script type="text/javascript"> 
   $(function(){ 
           if (document.location.href.indexOf('er=1') > 0) 
$("#display").show(); 
   }); 
</script>

and the html is

<div id="display" style="display:none;">wrong input</div>

my login form is

<form name="login-form" id="login-form" method="post" action=".php">
    <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
    <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
    <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
</form> 

still it shows display none.

My website is trackschoolbus.. You can see a login form at the top right. What I have set up is when a wrong input is given it redirects to home page with a parameter as ?er=1 i.e. http://www.trackschoolbus./?er=1. I need to display a error message when the error url es so I have written

<script type="text/javascript"> 
   $(function(){ 
           if (document.location.href.indexOf('er=1') > 0) 
$("#display").show(); 
   }); 
</script>

and the html is

<div id="display" style="display:none;">wrong input</div>

my login form is

<form name="login-form" id="login-form" method="post" action="http://www.trackschoolbus./vehicleTracking/index.php">
    <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
    <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
    <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
</form> 

still it shows display none.

• javascript
• php
• jquery
• html
• forms

Share Improve this question Follow edited Apr 14, 2015 at 9:44 mplungjan 179k2828 gold badges182182 silver badges240240 bronze badges asked Apr 14, 2015 at 9:33 MelvinMelvin 38322 gold badges1313 silver badges4343 bronze badges 11

• Instead of Javascript you can use php condition – Sunil Pachlangia Commented Apr 14, 2015 at 9:35
• how can i add that ? – Melvin Commented Apr 14, 2015 at 9:36
• Is the $("#display").show(); inside if{ } or the code formatting is so? – Shaunak D Commented Apr 14, 2015 at 9:36
• 1 <input type="submit" onclick="this.disabled=true;this.form.submit();" is highly questionable. NEVER submit in a submit event and in some cases the submit event is stopped when the button is disabled. Instead hide it or replace it in the FORM's submit event – mplungjan Commented Apr 14, 2015 at 9:42
• 1 $("login-form").on("submit",function() { $("input[name='yt0']").hide();}); – mplungjan Commented Apr 14, 2015 at 9:49

 |  Show 6 more ments

3 Answers 3

Sorted by: Reset to default 4

use php

    <form name="login-form" id="login-form" method="post" action="http://www.trackschoolbus./vehicleTracking/index.php">
            <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
            <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
            <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
            <?php if (isset($_GET['er']) && $_GET['er'] == 1) {
                echo '<div id="display">wrong input</div>';
            }?>
            </form> 

You can use this code

if ($_REQUEST['er']==1)
{
   echo '<script type="text/javascript"> 
      $("#display").show(); 
   </script>';
}

This is relatively simple in javascript.

Using the code snippet in this thread: How can I get query string values in JavaScript?

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
if (getParameterByName("er") == "1") 
    $("#display").show(); 
}); 

My website is trackschoolbus. You can see a login form at the top right. What I have set up is when a wrong input is given it redirects to home page with a parameter as ?er=1 i.e. /?er=1. I need to display a error message when the error url es so I have written

<script type="text/javascript"> 
   $(function(){ 
           if (document.location.href.indexOf('er=1') > 0) 
$("#display").show(); 
   }); 
</script>

and the html is

<div id="display" style="display:none;">wrong input</div>

my login form is

<form name="login-form" id="login-form" method="post" action=".php">
    <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
    <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
    <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
</form> 

still it shows display none.

My website is trackschoolbus.. You can see a login form at the top right. What I have set up is when a wrong input is given it redirects to home page with a parameter as ?er=1 i.e. http://www.trackschoolbus./?er=1. I need to display a error message when the error url es so I have written

<script type="text/javascript"> 
   $(function(){ 
           if (document.location.href.indexOf('er=1') > 0) 
$("#display").show(); 
   }); 
</script>

and the html is

<div id="display" style="display:none;">wrong input</div>

my login form is

<form name="login-form" id="login-form" method="post" action="http://www.trackschoolbus./vehicleTracking/index.php">
    <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
    <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
    <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
</form> 

still it shows display none.

• javascript
• php
• jquery
• html
• forms

Share Improve this question Follow edited Apr 14, 2015 at 9:44 mplungjan 179k2828 gold badges182182 silver badges240240 bronze badges asked Apr 14, 2015 at 9:33 MelvinMelvin 38322 gold badges1313 silver badges4343 bronze badges 11

• Instead of Javascript you can use php condition – Sunil Pachlangia Commented Apr 14, 2015 at 9:35
• how can i add that ? – Melvin Commented Apr 14, 2015 at 9:36
• Is the $("#display").show(); inside if{ } or the code formatting is so? – Shaunak D Commented Apr 14, 2015 at 9:36
• 1 <input type="submit" onclick="this.disabled=true;this.form.submit();" is highly questionable. NEVER submit in a submit event and in some cases the submit event is stopped when the button is disabled. Instead hide it or replace it in the FORM's submit event – mplungjan Commented Apr 14, 2015 at 9:42
• 1 $("login-form").on("submit",function() { $("input[name='yt0']").hide();}); – mplungjan Commented Apr 14, 2015 at 9:49

 |  Show 6 more ments

3 Answers 3

Sorted by: Reset to default 4

use php

    <form name="login-form" id="login-form" method="post" action="http://www.trackschoolbus./vehicleTracking/index.php">
            <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
            <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
            <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
            <?php if (isset($_GET['er']) && $_GET['er'] == 1) {
                echo '<div id="display">wrong input</div>';
            }?>
            </form> 

You can use this code

if ($_REQUEST['er']==1)
{
   echo '<script type="text/javascript"> 
      $("#display").show(); 
   </script>';
}

This is relatively simple in javascript.

Using the code snippet in this thread: How can I get query string values in JavaScript?

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
if (getParameterByName("er") == "1") 
    $("#display").show(); 
}); 

本文标签： javascriptdisplay a div based on url parameterStack Overflow