[jQuery] Re: Text Button
Hi rob,
Thanks a lot. Your answers are very helpful.
cheers,
james
On May 23, 4:25 pm, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> Karl,
> Any particular reason why you would use a link to click the button to
> perform the button's task, rather than just disposing of the button and
> assigning its task to the link? If that made no sense ;-) take an example:
> why create an invisible button to save, then use jQuery to create a link out
> of it, when you could just write this:
>Save
> It removes the need to modify the DOM unnecessarily and also means that the
> source HTML shows more closely its final content.
>
> James,
> Good question...first assumption would be it varies between browsers.
> Offhand I think most do not show the updated source, however a tool such as
> Firebug [http://www.getfirebug.com/] will show the updated DOM instead.
> You'd have to test it with your browser to find out for sure.
>
> --rob
>
> On 5/23/07, james_027 <[EMAIL PROTECTED]> wrote:
>
>
>
>
>
> > Hi rob,
>
> > Thanks very much, that really gives me a lot info. I'll take your
> > suggestion ...
> > Another question ... You mention about the browser to update its DOM
> > with $('p').click(...) does this update can be seen when your view the
> > source or it is done internally?
>
> > Thanks again
> > james
>
> > On May 22, 10:56 pm, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> > > James,
>
> > > The tag is a different element created to allow much more
> > control
> > > over styling and content - you can include markup such as images and
> > styling
> > > in a tag which is not possible with
>
> > > As for which of the two approaches I prefer - I'd go for > > href="javascript:foo()"> as the javascript IS the link target, creating
> > an
> > > onclick() handler and putting a fake value in the href attribute is to
> > my
> > > mind misusing the tag.
>
> > > Alexandre's approach works - however unless you need to dynamically
> > assign
> > > different click event handlers, I think it is better to put the event
> > > handler into the source rather than setting it with jQuery.
> > > Why force the browser to update its DOM with $('p').click(...) once
> > the
> > > page is loaded when you can set it just by coding the tag? It'll slow
> > the
> > > browser slightly as it updates the page after loading, which is
> > cumulative
> > > if you have to do it for many links/tags.
>
> > > Hope all that info helps!
> > > --rob
>
> > > On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote:
>
> > > > Hi,
>
> > > > what is the difference between to
>
> > > > Thanks
> > > > james
> > > > On May 22, 5:20 pm, Bob den Otter <[EMAIL PROTECTED]> wrote:
> > > > > james_027 wrote:
> > > > > > Hi,
>
> > > > > > Is this the best way to make a text button?
>
> > > > > > Click Me!
>
> > > > > Slightly offtopic, but you might want to look into this:
> > > >http://particletree.com/features/rediscovering-the-button-element/
>
> > > > > Besides the tag, they also go into styling tags to
> > resemble
> > > > > buttons.
>
> > > > > Best, Bob.
>
> > > --
> > > Rob Desbois
> > > Eml: [EMAIL PROTECTED]
> > > Tel: 01452 760631
> > > Mob: 07946 705987
> > > "There's a whale there's a whale there's a whale fish" he cried, and the
> > > whale was in full view.
> > > ...Then ooh welcome. Ahhh. Ooh mug welcome.
>
> --
> Rob Desbois
> Eml: [EMAIL PROTECTED]
> Tel: 01452 760631
> Mob: 07946 705987
> "There's a whale there's a whale there's a whale fish" he cried, and the
> whale was in full view.
> ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
Rob,
I work at a university (in Australia) doing what can be best described
as "web front-end construction". Most of our work is for government
and/or educational groups so there are certain guidelines and
regulations that we need to follow.
A submit button is needed because most of the sites we do are required
(as in a legal requirement) to work without JavaScript turned on. If I
were to use just a JavaScript link then obviously there'd be problems.
It also makes building a front end for an existing site a lot easier
as I just need to add a class to the submit button and style the
resulting link. This is especially true on pages with multiple submit
buttons where I don't need to worry about passing back the right value
for the button pressed.
I could just use a normal button but of course our graphic designer
wouldn't be as happy with the possibilities :). (Not to mention Safari
doesn't really allow _any_ styling of buttons.)
I try to use JavaScript as "icing" rather than "required cake". It's
partly about "progressive enhancement", partly about accessibility,
partly about separation of layers (content, look and behavior) and
partly about ease of testability.
The JavaScript link is alright if you have a very limited audience for
your site, where you can guarantee exactly what machines and browsers
are going to be running.
Karl Rudd
On 5/23/07, Rob Desbois <[EMAIL PROTECTED]> wrote:
Karl,
Any particular reason why you would use a link to click the button to
perform the button's task, rather than just disposing of the button and
assigning its task to the link? If that made no sense ;-) take an example:
why create an invisible button to save, then use jQuery to create a link out
of it, when you could just write this:
Save
It removes the need to modify the DOM unnecessarily and also means that the
source HTML shows more closely its final content.
James,
Good question...first assumption would be it varies between browsers.
Offhand I think most do not show the updated source, however a tool such as
Firebug [ http://www.getfirebug.com/] will show the updated DOM instead.
You'd have to test it with your browser to find out for sure.
--rob
On 5/23/07, james_027 <[EMAIL PROTECTED]> wrote:
>
> Hi rob,
>
> Thanks very much, that really gives me a lot info. I'll take your
> suggestion ...
> Another question ... You mention about the browser to update its DOM
> with $('p').click(...) does this update can be seen when your view the
> source or it is done internally?
>
> Thanks again
> james
>
> On May 22, 10:56 pm, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> > James,
> >
> > The tag is a different element created to allow much more
control
> > over styling and content - you can include markup such as images and
styling
> > in a tag which is not possible with
> >
> > As for which of the two approaches I prefer - I'd go for > href="javascript:foo()"> as the javascript IS the link target, creating
an
> > onclick() handler and putting a fake value in the href attribute is to
my
> > mind misusing the tag.
> >
> > Alexandre's approach works - however unless you need to dynamically
assign
> > different click event handlers, I think it is better to put the event
> > handler into the source rather than setting it with jQuery.
> > Why force the browser to update its DOM with $('p').click(...) once
the
> > page is loaded when you can set it just by coding the tag? It'll slow
the
> > browser slightly as it updates the page after loading, which is
cumulative
> > if you have to do it for many links/tags.
> >
> > Hope all that info helps!
> > --rob
> >
> > On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote:
> >
> >
> >
> >
> >
> > > Hi,
> >
> > > what is the difference between to
> >
> > > Thanks
> > > james
> > > On May 22, 5:20 pm, Bob den Otter < [EMAIL PROTECTED]> wrote:
> > > > james_027 wrote:
> > > > > Hi,
> >
> > > > > Is this the best way to make a text button?
> >
> > > > > Click Me!
> >
> > > > Slightly offtopic, but you might want to look into this:
> >
>http://particletree.com/features/rediscovering-the-button-element/
> >
> > > > Besides the tag, they also go into styling tags to
resemble
> > > > buttons.
> >
> > > > Best, Bob.
> >
> > --
> > Rob Desbois
> > Eml: [EMAIL PROTECTED]
> > Tel: 01452 760631
> > Mob: 07946 705987
> > "There's a whale there's a whale there's a whale fish" he cried, and the
> > whale was in full view.
> > ...Then ooh welcome. Ahhh. Ooh mug welcome.
>
>
--
Rob Desbois
Eml: [EMAIL PROTECTED]
Tel: 01452 760631
Mob: 07946 705987
"There's a whale there's a whale there's a whale fish" he cried, and the
whale was in full view.
...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
Karl,
Any particular reason why you would use a link to click the button to
perform the button's task, rather than just disposing of the button and
assigning its task to the link? If that made no sense ;-) take an example:
why create an invisible button to save, then use jQuery to create a link out
of it, when you could just write this:
Save
It removes the need to modify the DOM unnecessarily and also means that the
source HTML shows more closely its final content.
James,
Good question...first assumption would be it varies between browsers.
Offhand I think most do not show the updated source, however a tool such as
Firebug [http://www.getfirebug.com/] will show the updated DOM instead.
You'd have to test it with your browser to find out for sure.
--rob
On 5/23/07, james_027 <[EMAIL PROTECTED]> wrote:
Hi rob,
Thanks very much, that really gives me a lot info. I'll take your
suggestion ...
Another question ... You mention about the browser to update its DOM
with $('p').click(...) does this update can be seen when your view the
source or it is done internally?
Thanks again
james
On May 22, 10:56 pm, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> James,
>
> The tag is a different element created to allow much more
control
> over styling and content - you can include markup such as images and
styling
> in a tag which is not possible with
>
> As for which of the two approaches I prefer - I'd go for href="javascript:foo()"> as the javascript IS the link target, creating
an
> onclick() handler and putting a fake value in the href attribute is to
my
> mind misusing the tag.
>
> Alexandre's approach works - however unless you need to dynamically
assign
> different click event handlers, I think it is better to put the event
> handler into the source rather than setting it with jQuery.
> Why force the browser to update its DOM with $('p').click(...) once
the
> page is loaded when you can set it just by coding the tag? It'll slow
the
> browser slightly as it updates the page after loading, which is
cumulative
> if you have to do it for many links/tags.
>
> Hope all that info helps!
> --rob
>
> On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote:
>
>
>
>
>
> > Hi,
>
> > what is the difference between to
>
> > Thanks
> > james
> > On May 22, 5:20 pm, Bob den Otter <[EMAIL PROTECTED]> wrote:
> > > james_027 wrote:
> > > > Hi,
>
> > > > Is this the best way to make a text button?
>
> > > > Click Me!
>
> > > Slightly offtopic, but you might want to look into this:
> >http://particletree.com/features/rediscovering-the-button-element/
>
> > > Besides the tag, they also go into styling tags to
resemble
> > > buttons.
>
> > > Best, Bob.
>
> --
> Rob Desbois
> Eml: [EMAIL PROTECTED]
> Tel: 01452 760631
> Mob: 07946 705987
> "There's a whale there's a whale there's a whale fish" he cried, and the
> whale was in full view.
> ...Then ooh welcome. Ahhh. Ooh mug welcome.
--
Rob Desbois
Eml: [EMAIL PROTECTED]
Tel: 01452 760631
Mob: 07946 705987
"There's a whale there's a whale there's a whale fish" he cried, and the
whale was in full view.
...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
Hi rob,
Thanks very much, that really gives me a lot info. I'll take your
suggestion ...
Another question ... You mention about the browser to update its DOM
with $('p').click(...) does this update can be seen when your view the
source or it is done internally?
Thanks again
james
On May 22, 10:56 pm, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> James,
>
> The tag is a different element created to allow much more control
> over styling and content - you can include markup such as images and styling
> in a tag which is not possible with
>
> As for which of the two approaches I prefer - I'd go for href="javascript:foo()"> as the javascript IS the link target, creating an
> onclick() handler and putting a fake value in the href attribute is to my
> mind misusing the tag.
>
> Alexandre's approach works - however unless you need to dynamically assign
> different click event handlers, I think it is better to put the event
> handler into the source rather than setting it with jQuery.
> Why force the browser to update its DOM with $('p').click(...) once the
> page is loaded when you can set it just by coding the tag? It'll slow the
> browser slightly as it updates the page after loading, which is cumulative
> if you have to do it for many links/tags.
>
> Hope all that info helps!
> --rob
>
> On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote:
>
>
>
>
>
> > Hi,
>
> > what is the difference between to
>
> > Thanks
> > james
> > On May 22, 5:20 pm, Bob den Otter <[EMAIL PROTECTED]> wrote:
> > > james_027 wrote:
> > > > Hi,
>
> > > > Is this the best way to make a text button?
>
> > > > Click Me!
>
> > > Slightly offtopic, but you might want to look into this:
> >http://particletree.com/features/rediscovering-the-button-element/
>
> > > Besides the tag, they also go into styling tags to resemble
> > > buttons.
>
> > > Best, Bob.
>
> --
> Rob Desbois
> Eml: [EMAIL PROTECTED]
> Tel: 01452 760631
> Mob: 07946 705987
> "There's a whale there's a whale there's a whale fish" he cried, and the
> whale was in full view.
> ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
This has come up a number of times.
My suggestion is to use a "proxy link". When the link is pressed it
"clicks" the button.
Something like this:
$(function() {
$('input.proxy').each( function() {
var input = $(this);
$('' + this.value + '')
.attr( 'class', this.className )
.insertBefore( this)
.click( function() {
input.click();
return false;
});
input.hide();
});
});
(Sidenote: The code I posted last time for this question was
incorrect and would not work.)
The initial HTML looks like this:
After jQuery has done it's thing it look like this:
Save
And voila, you have a link you can style to your heart's content the
functions just like the normal submit button.
Karl Rudd
On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote:
Hi,
Is this the best way to make a text button?
Click Me!
It's nice that even with using jquery could make almost
any tag to have click event, but the problem is the cursor doesn't
indicate that it's clickable.
Thanks in advance for any tips, suggestion, guides
cheers,
james
[jQuery] Re: Text Button
James,
The tag is a different element created to allow much more control
over styling and content - you can include markup such as images and styling
in a tag which is not possible with
As for which of the two approaches I prefer - I'd go for as the javascript IS the link target, creating an
onclick() handler and putting a fake value in the href attribute is to my
mind misusing the tag.
Alexandre's approach works - however unless you need to dynamically assign
different click event handlers, I think it is better to put the event
handler into the source rather than setting it with jQuery.
Why force the browser to update its DOM with $('p').click(...) once the
page is loaded when you can set it just by coding the tag? It'll slow the
browser slightly as it updates the page after loading, which is cumulative
if you have to do it for many links/tags.
Hope all that info helps!
--rob
On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote:
Hi,
what is the difference between to
Thanks
james
On May 22, 5:20 pm, Bob den Otter <[EMAIL PROTECTED]> wrote:
> james_027 wrote:
> > Hi,
>
> > Is this the best way to make a text button?
>
> > Click Me!
>
> Slightly offtopic, but you might want to look into this:
http://particletree.com/features/rediscovering-the-button-element/
>
> Besides the tag, they also go into styling tags to resemble
> buttons.
>
> Best, Bob.
--
Rob Desbois
Eml: [EMAIL PROTECTED]
Tel: 01452 760631
Mob: 07946 705987
"There's a whale there's a whale there's a whale fish" he cried, and the
whale was in full view.
...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
Hi,
Thanks a lot, exactly what I am looking for.
Cheers
james
On May 22, 6:50 pm, "Alexandre Plennevaux" <[EMAIL PROTECTED]>
wrote:
> 1/ you can make any tag clickable by adding a "click" event. That's thanks
> to javascript, but jquery makes it more easily accessible.
>
> $('p').click(function(){
>
> // do this and do that
> ...
>
> });
>
> As for the cursor "hand" look , you can do that in css
> p{
> Cursor: pointer;
>
> }
> -Original Message-
> From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
>
> Behalf Of james_027
> Sent: mardi 22 mai 2007 10:05
> To: jQuery (English)
> Subject: [jQuery] Text Button
>
> Hi,
>
> Is this the best way to make a text button?
>
> Click Me!
>
> It's nice that even with using jquery could make almost any tag
> to have click event, but the problem is the cursor doesn't indicate that
> it's clickable.
>
> Thanks in advance for any tips, suggestion, guides
>
> cheers,
> james
>
> Ce message Envoi est certifié sans virus connu.
> Analyse effectuée par AVG.
> Version: 7.5.467 / Base de données virus: 269.7.6/814 - Date: 21/05/2007
> 14:01
[jQuery] Re: Text Button
Hi, what is the difference between to Thanks james On May 22, 5:20 pm, Bob den Otter <[EMAIL PROTECTED]> wrote: > james_027 wrote: > > Hi, > > > Is this the best way to make a text button? > > > Click Me! > > Slightly offtopic, but you might want to look into > this:http://particletree.com/features/rediscovering-the-button-element/ > > Besides the tag, they also go into styling tags to resemble > buttons. > > Best, Bob.
[jQuery] Re: Text Button
Hi, Thanks Rob. Just want to ask you which of the two suggestion is more optimize or efficient? Thanks On May 22, 5:16 pm, "Rob Desbois" <[EMAIL PROTECTED]> wrote: > When you say 'text button' I'm assuming that you don't want the usual button > created with one of: > > > > Two ways to get an anchor tag to invoke a javascript action instead of > navigating to a different page / anchor: >Click Me! >Click Me! > > If you want to make any tag have the usual clickable link type cursor then > CSS can help: >Hover > > The two cursor declarations are needed there as MSIE 5.0 and 5.5 only > support 'hand', whereas other browsers use 'pointer' (although some do > support hand as well). > > --rob > > On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote: > > > > > > > Hi, > > > Is this the best way to make a text button? > > > Click Me! > > > It's nice that even with using jquery could make almost > > any tag to have click event, but the problem is the cursor doesn't > > indicate that it's clickable. > > > Thanks in advance for any tips, suggestion, guides > > > cheers, > > james > > -- > Rob Desbois > Eml: [EMAIL PROTECTED] > Tel: 01452 760631 > Mob: 07946 705987 > "There's a whale there's a whale there's a whale fish" he cried, and the > whale was in full view. > ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
Hi, What I mean is when the cursor go over the tag, it doesn't show that it is clickable ... hope you got what I mean. james On May 22, 5:15 pm, Michael Stuhr <[EMAIL PROTECTED]> wrote: > james_027 schrieb: > > > Hi, > > > Is this the best way to make a text button? > > > Click Me! > > > It's nice that even with using jquery could make almost > > any tag to have click event, but the problem is the cursor doesn't > > indicate that it's clickable. > > what do you mean by "the cursor doesn't indicate that it's clickable" > ... btw: it's called a link. > > micha
[jQuery] Re: Text Button
1/ you can make any tag clickable by adding a "click" event. That's thanks
to javascript, but jquery makes it more easily accessible.
$('p').click(function(){
// do this and do that
...
});
As for the cursor "hand" look , you can do that in css
p{
Cursor: pointer;
}
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of james_027
Sent: mardi 22 mai 2007 10:05
To: jQuery (English)
Subject: [jQuery] Text Button
Hi,
Is this the best way to make a text button?
Click Me!
It's nice that even with using jquery could make almost any tag
to have click event, but the problem is the cursor doesn't indicate that
it's clickable.
Thanks in advance for any tips, suggestion, guides
cheers,
james
Ce message Envoi est certifié sans virus connu.
Analyse effectuée par AVG.
Version: 7.5.467 / Base de données virus: 269.7.6/814 - Date: 21/05/2007
14:01
[jQuery] Re: Text Button
Nice article - however it is incorrect when it says the element 'behaves in exactly the same way as [the tag]'. MSIE's implementation of is...a pain in the backside at best! Information on that is at http://www.peterbe.com/plog/button-tag-in-IE --rob On 5/22/07, Bob den Otter <[EMAIL PROTECTED]> wrote: james_027 wrote: > Hi, > > Is this the best way to make a text button? > > Click Me! > Slightly offtopic, but you might want to look into this: http://particletree.com/features/rediscovering-the-button-element/ Besides the tag, they also go into styling tags to resemble buttons. Best, Bob. -- Rob Desbois Eml: [EMAIL PROTECTED] Tel: 01452 760631 Mob: 07946 705987 "There's a whale there's a whale there's a whale fish" he cried, and the whale was in full view. ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
james_027 wrote: Hi, Is this the best way to make a text button? Click Me! Slightly offtopic, but you might want to look into this: http://particletree.com/features/rediscovering-the-button-element/ Besides the tag, they also go into styling tags to resemble buttons. Best, Bob.
[jQuery] Re: Text Button
When you say 'text button' I'm assuming that you don't want the usual button created with one of: Two ways to get an anchor tag to invoke a javascript action instead of navigating to a different page / anchor: Click Me! Click Me! If you want to make any tag have the usual clickable link type cursor then CSS can help: Hover The two cursor declarations are needed there as MSIE 5.0 and 5.5 only support 'hand', whereas other browsers use 'pointer' (although some do support hand as well). --rob On 5/22/07, james_027 <[EMAIL PROTECTED]> wrote: Hi, Is this the best way to make a text button? Click Me! It's nice that even with using jquery could make almost any tag to have click event, but the problem is the cursor doesn't indicate that it's clickable. Thanks in advance for any tips, suggestion, guides cheers, james -- Rob Desbois Eml: [EMAIL PROTECTED] Tel: 01452 760631 Mob: 07946 705987 "There's a whale there's a whale there's a whale fish" he cried, and the whale was in full view. ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: Text Button
james_027 schrieb: Hi, Is this the best way to make a text button? Click Me! It's nice that even with using jquery could make almost any tag to have click event, but the problem is the cursor doesn't indicate that it's clickable. what do you mean by "the cursor doesn't indicate that it's clickable" ... btw: it's called a link. micha
