This is not a good practice to use directly the tags in the JQuery to find them. And they won't work too. And you should write everything inside $(document).ready().
Change your code a bit different as shown below [Complete code]
<button id="btnShow">Show it</button>
<p id="pContent" style="display:none">Hello</p>
<script type="text/javascript">
$(document).ready(function(){
$("#btnShow").click(function(){
$("#pContent").show();
});
});
</script>
Hope this helps and you got what you need. Let me know, if you need any more help.
What if you have lot of similar controls and u want to apply same css, events etc to all of them, so you would go any add them individually by id's.?
It's not a good practice, here's why:
Let's say you have one or more BUTTON elements and you want to add click handlers to them ... You can do that by using the type selector "button":
$("button").click( .... );
... and it will work (for all your buttons).
Now, let's say you want to add another BUTTON element to the page, but you don't want it do have the above mentioned click handler attached to it. How do you exclude this particular button? Well,
you can't. The handler is attached to all buttons.
So by adding behavior (like event handlers) using the type selector, you limit that type. You cannot use the type anymore without having the behavior attached to it automatically.
Therefore, we use the class selector and/or the descendant selector to select exactly the elements we want, without selecting all elements of that type.
srachuri
Member
323 Points
770 Posts
how to show this tag using jquery?
Apr 08, 2010 05:41 PM|LINK
<button>Show it</button>
<p style="display: none">Hello 2</p>
<script type="text/jscript">
$("button").click(function() {
$('p').show();
});
</script>
if I click Show it Hello 2 needs to show in my ascx file.
but its not showing me up there? is that anything I am doing wrong here?
thanks
karan@dotnet
All-Star
26228 Points
4596 Posts
Re: how to show this tag using jquery?
Apr 08, 2010 05:49 PM|LINK
try: $("#button") instead of $("button").
Karan
~ Blog ~
Remember To Mark The Post(s) That Helped You As The ANSWER
MetalAsp.Net
All-Star
112032 Points
18231 Posts
Moderator
Re: how to show this tag using jquery?
Apr 08, 2010 06:05 PM|LINK
Made some minor changes:
$("button").click(function(event) { $('p').show(); event.preventDefault(); });This works in IE8. Also, you may want to put this code in a .ready() block.
praveen.batt...
Member
722 Points
151 Posts
Re: how to show this tag using jquery?
Apr 08, 2010 06:42 PM|LINK
Hi,
This is not a good practice to use directly the tags in the JQuery to find them. And they won't work too. And you should write everything inside $(document).ready().
Change your code a bit different as shown below [Complete code]
<button id="btnShow">Show it</button>
<p id="pContent" style="display:none">Hello</p>
<script type="text/javascript">
$(document).ready(function(){
$("#btnShow").click(function(){
$("#pContent").show();
});
});
</script>
Hope this helps and you got what you need. Let me know, if you need any more help.
Site: Rare Solutions
Angry ASP.ne...
Member
89 Points
39 Posts
Re: how to show this tag using jquery?
Apr 08, 2010 07:43 PM|LINK
What are you talking about? Why wouldn't they work?
You can use type selectors in jQuery if you want to, and they work.
karan@dotnet
All-Star
26228 Points
4596 Posts
Re: how to show this tag using jquery?
Apr 08, 2010 07:49 PM|LINK
Yes they do work, why isnt a good practice.?
What if you have lot of similar controls and u want to apply same css, events etc to all of them, so you would go any add them individually by id's.?
Karan
~ Blog ~
Remember To Mark The Post(s) That Helped You As The ANSWER
MetalAsp.Net
All-Star
112032 Points
18231 Posts
Moderator
Re: how to show this tag using jquery?
Apr 08, 2010 08:13 PM|LINK
That would not work. The button doesn't have an ID of "button". Don't know who's marking answers...
Angry ASP.ne...
Member
89 Points
39 Posts
Re: how to show this tag using jquery?
Apr 08, 2010 08:20 PM|LINK
It's not a good practice, here's why:
Let's say you have one or more BUTTON elements and you want to add click handlers to them ... You can do that by using the type selector "button":
$("button").click( .... );
... and it will work (for all your buttons).
Now, let's say you want to add another BUTTON element to the page, but you don't want it do have the above mentioned click handler attached to it. How do you exclude this particular button? Well, you can't. The handler is attached to all buttons.
So by adding behavior (like event handlers) using the type selector, you limit that type. You cannot use the type anymore without having the behavior attached to it automatically.
Therefore, we use the class selector and/or the descendant selector to select exactly the elements we want, without selecting all elements of that type.