Sagar Singh Sagar Singh - 2 years ago 150
HTML Question

How to show hidden elements and Scroll to that element

I have four forms that is hidden by display none css style and when someone will click on link the respective form should be shown
for e.g

<a href="#form1">show form1</a>
<a href="#form2">show form 2</a>
<a href="#form3">show form 3</a>

each form has its own unique id

form 1 id="form1"
form 2 id="form2"
form 3 id="form3"

So here is what I've tried

jQuery(document).ready(function($) {
$('a[href^="#"]').on('click', function(event) {

var target = $( $(this).attr('href') );
var ptel = $(this).attr("href");
$("#" +ptel).show(); // i tried simply $("ptel")
if( target.length ) {
$('html, body').animate({
scrollTop: target.offset().top
}, 2000);


when i alert ptel variable it gives me an alert with value of #form1, #form2
but the form is not shown

Answer Source

Change this line:

$("#" +ptel).show(); // i tried simply $("ptel") 



You don't need to concatenate the # and your first attempt was close, but you didn't need the quotes.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download