Sagar Singh Sagar Singh - 7 months ago 17
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");
alert(ptel);
$("#" +ptel).show(); // i tried simply $("ptel")
if( target.length ) {
event.preventDefault();
$('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

Change this line:

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

to

$(ptel).show();

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