[jQuery] simple - focusing on an input
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:st1="urn:schemas-microsoft-com:office:smarttags" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv=Content-Type content="text/html; charset=us-ascii">
<meta name=Generator content="Microsoft Word 11 (filtered medium)">
<!--[if !mso]>
<style>
v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]--><o:SmartTagType
namespaceuri="urn:schemas-microsoft-com:office:smarttags" name="PersonName"/>
<!--[if !mso]>
<style>
st1\:*{behavior:url(#default#ieooui) }
</style>
<![endif]-->
<style>
<!--
/* Font Definitions */
@font-face
{font-family:Helvetica;
panose-1:2 11 6 4 2 2 2 2 2 4;}
@font-face
{font-family:Tahoma;
panose-1:2 11 6 4 3 5 4 4 2 4;}
@font-face
{font-family:Consolas;
panose-1:2 11 6 9 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:"Times New Roman";
color:#333300;}
a:link, span.MsoHyperlink
{color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{color:purple;
text-decoration:underline;}
pre
{margin:0in;
margin-bottom:.0001pt;
font-size:10.0pt;
font-family:"Courier New";
color:#333300;}
span.EmailStyle18
{mso-style-type:personal;
font-family:Arial;
color:windowtext;}
span.EmailStyle19
{mso-style-type:personal;
font-family:Arial;
color:navy;}
span.EmailStyle20
{mso-style-type:personal;
font-family:Arial;
color:navy;}
span.EmailStyle21
{mso-style-type:personal;
font-family:Arial;
color:navy;}
span.EmailStyle22
{mso-style-type:personal-reply;
font-family:Arial;
color:navy;}
@page Section1
{size:8.5in 11.0in;
margin:1.0in 1.25in 1.0in 1.25in;}
div.Section1
{page:Section1;}
-->
</style>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body bgcolor=white lang=EN-US link=blue vlink=purple>
<div class=Section1>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Thanks Alex. To be clear, how does
one differentiate between the jQuery helper function .focus() and the native
browser function of the same name?<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color="#1f2029" face="Times New Roman"><span style='font-size:12.0pt;
color:windowtext'>
<hr size=3 width="100%" align=center tabindex=-1>
</span></font></div>
<p class=MsoNormal><b><font size=2 color="#1f2029" face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;color:windowtext;font-weight:bold'>From:</span></font></b><font
size=2 color="#1f2029" face=Tahoma><span style='font-size:10.0pt;font-family:
Tahoma;color:windowtext'> discuss-bounces@jquery.com
[mailto:discuss-bounces@jquery.com] <b><span style='font-weight:bold'>On Behalf
Of </span></b>Alex Cook
<b><span style='font-weight:bold'>Sent:</span></b> Friday, March 09, 2007 2:54
PM
<b><span style='font-weight:bold'>To:</span></b> jQuery Discussion.
<b><span style='font-weight:bold'>Subject:</span></b> Re: [jQuery] simple -
focusing on an input</span></font><font color="#1f2029"><span style='color:
windowtext'><o:p></o:p></span></font>
</div>
<p class=MsoNormal><font size=3 color="#333300" face="Times New Roman"><span
style='font-size:12.0pt'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Paul,<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>So you understand, the array notation
Francesco originally brought up is in order to get the DOM element you searched
for.<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>A jQuery object is an array DOM elements
even if there is only one entry. So, if you wanted to use the browser
native function .focus() and not the jQuery helper function .focus(), you want
to access the raw DOM element. #(“#orderFinder input”)[0] is
the same as .get(), which does exactly what it says. <o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Now, as to why your original code
wasn’t working, animations are asynchronous and so the script continues
to run after they are started. By using the animations callback function
you can see that the next bit of code isn’t executed until the animation
is completed.<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>HTH<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>-ALEX<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color="#1f2029" face="Times New Roman"><span style='font-size:12.0pt;
color:windowtext'>
<hr size=2 width="100%" align=center tabindex=-1>
</span></font></div>
<p class=MsoNormal><b><font size=2 color="#1f2029" face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;color:windowtext;font-weight:bold'>From:</span></font></b><font
size=2 color="#1f2029" face=Tahoma><span style='font-size:10.0pt;font-family:
Tahoma;color:windowtext'> discuss-bounces@jquery.com
[mailto:discuss-bounces@jquery.com] <b><span style='font-weight:bold'>On Behalf
Of </span></b>Paul
<b><span style='font-weight:bold'>Sent:</span></b> Friday, March 09, 2007 1:31
PM
<b><span style='font-weight:bold'>To:</span></b> '<st1:PersonName w:st="on">jQuery
Discussion.</st1:PersonName>'
<b><span style='font-weight:bold'>Subject:</span></b> Re: [jQuery] simple -
focusing on an input</span></font><font color="#1f2029"><span style='color:
windowtext'><o:p></o:p></span></font>
</div>
<p class=MsoNormal><font size=3 color="#333300" face="Times New Roman"><span
style='font-size:12.0pt'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>By the way I solved this by putting the
.focus() function in the callback for SlideToggleUp()…<o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color="#1f2029" face="Times New Roman"><span style='font-size:12.0pt;
color:windowtext'>
<hr size=3 width="100%" align=center tabindex=-1>
</span></font></div>
<p class=MsoNormal><b><font size=2 color="#1f2029" face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;color:windowtext;font-weight:bold'>From:</span></font></b><font
size=2 color="#1f2029" face=Tahoma><span style='font-size:10.0pt;font-family:
Tahoma;color:windowtext'> discuss-bounces@jquery.com
[mailto:discuss-bounces@jquery.com] <b><span style='font-weight:bold'>On Behalf
Of </span></b>Andy Matthews
<b><span style='font-weight:bold'>Sent:</span></b> Friday, March 09, 2007 1:29
PM
<b><span style='font-weight:bold'>To:</span></b> '<st1:PersonName w:st="on">jQuery
Discussion.</st1:PersonName>'
<b><span style='font-weight:bold'>Subject:</span></b> Re: [jQuery] simple -
focusing on an input</span></font><font color="#1f2029"><span style='color:
windowtext'><o:p></o:p></span></font>
</div>
<p class=MsoNormal><font size=3 color="#333300" face="Times New Roman"><span
style='font-size:12.0pt'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=2 color=blue face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:blue'>It references the first matching element.
It's array notation.</span></font><font color="#1f2029"><span style='color:
windowtext'><o:p></o:p></span></font>
<p class=MsoNormal><font size=3 color="#1f2029" face="Times New Roman"><span
style='font-size:12.0pt;color:windowtext'><o:p> </o:p></span></font>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color="#1f2029" face="Times New Roman"><span style='font-size:12.0pt;
color:windowtext'>
<hr size=3 width="100%" align=center tabIndex=-1>
</span></font></div>
<p class=MsoNormal style='margin-bottom:12.0pt'><b><font size=2 color="#1f2029"
face=Tahoma><span style='font-size:10.0pt;font-family:Tahoma;color:windowtext;
font-weight:bold'>From:</span></font></b><font size=2 color="#1f2029"
face=Tahoma><span style='font-size:10.0pt;font-family:Tahoma;color:windowtext'>
discuss-bounces@jquery.com [mailto:discuss-bounces@jquery.com] <b><span
style='font-weight:bold'>On Behalf Of </span></b>Paul
<b><span style='font-weight:bold'>Sent:</span></b> Friday, March 09, 2007 2:24
PM
<b><span style='font-weight:bold'>To:</span></b> '<st1:PersonName w:st="on">jQuery
Discussion.</st1:PersonName>'
<b><span style='font-weight:bold'>Subject:</span></b> Re: [jQuery] simple -
focusing on an input</span></font><font color="#1f2029"><span style='color:
windowtext'><o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'>Thanks for the reply, Francesco.
Your suggestion didn’t seem to work—but what is the purpose
of the [0] there? <o:p></o:p></span></font>
<p class=MsoNormal><font size=2 color=navy face=Arial><span style='font-size:
10.0pt;font-family:Arial;color:navy'><o:p> </o:p></span></font>
<div>
<div class=MsoNormal align=center style='text-align:center'><font size=3
color="#1f2029" face="Times New Roman"><span style='font-size:12.0pt;
color:windowtext'>
<hr size=3 width="100%" align=center tabIndex=-1>
</span></font></div>
<p class=MsoNormal><b><font size=2 color="#1f2029" face=Tahoma><span
style='font-size:10.0pt;font-family:Tahoma;color:windowtext;font-weight:bold'>From:</span></font></b><font
size=2 color="#1f2029" face=Tahoma><span style='font-size:10.0pt;font-family:
Tahoma;color:windowtext'> discuss-bounces@jquery.com
[mailto:discuss-bounces@jquery.com] <b><span style='font-weight:bold'>On Behalf
Of </span></b>Francesco Sullo
<b><span style='font-weight:bold'>Sent:</span></b> Friday, March 09, 2007 12:25
PM
<b><span style='font-weight:bold'>To:</span></b> <st1:PersonName w:st="on">jQuery
Discussion.</st1:PersonName>
<b><span style='font-weight:bold'>Subject:</span></b> Re: [jQuery] simple -
focusing on an input</span></font><font color="#1f2029"><span style='color:
windowtext'><o:p></o:p></span></font>
</div>
<p class=MsoNormal><font size=3 color="#333300" face="Times New Roman"><span
style='font-size:12.0pt'><o:p> </o:p></span></font>
<p class=MsoNormal><font size=3 color="#333300" face="Times New Roman"><span
style='font-size:12.0pt'>Use:
</span></font><font face=Helvetica><span style='font-family:Helvetica'>$("#orderFinder
input").val('')[0].focus()</span></font>
--Francesco
Paul ha scritto: <o:p></o:p>
<p class=MsoNormal><font size=2 color="#333300" face=Arial><span
style='font-size:10.0pt;font-family:Arial'>I’m trying to focus the cursor
in a text box at the end of a simple animation, and it won’t. The
cursor shows up temporarily in the box, then flits away…<U1:P></U1:P></span></font><o:p></o:p>
<p class=MsoNormal><font size=2 color="#333300" face=Arial><span
style='font-size:10.0pt;font-family:Arial'><U1:P> </U1:P></span></font><o:p></o:p>
<p class=MsoNormal><font size=1 color=black face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:black'>$(</span></font><font
size=1 color="#006600" face=Consolas><span style='font-size:8.0pt;font-family:
Consolas;color:#006600'>"#orderFinder"</span></font><font size=1
color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>)</span></font><font size=1 color=blue face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:blue'>.</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>SlideToggleUp(</span></font><font size=1 color="#ff0a0a"
face=Consolas><span style='font-size:8.0pt;font-family:Consolas;color:#FF0A0A'>250</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>, </span></font><font size=1 color=blue face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:blue'>null</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>, </span></font><font size=1 color="#006600" face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:#006600'>'bounceout'</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>); // show/hide the div<U1:P></U1:P></span></font><o:p></o:p>
<p class=MsoNormal><font size=1 color=black face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:black'>$(</span></font><font
size=1 color="#006600" face=Consolas><span style='font-size:8.0pt;font-family:
Consolas;color:#006600'>"#orderFinder input"</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>)</span></font><font size=1 color=blue face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:blue'>.val</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>(</span></font><font size=1 color="#006600" face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:#006600'>''</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>)</span></font><font size=1 color=blue face=Consolas><span
style='font-size:8.0pt;font-family:Consolas;color:blue'>.</span></font><font
size=1 color=black face=Consolas><span style='font-size:8.0pt;font-family:Consolas;
color:black'>focus();
// reset the value and focus on the field</span></font><o:p></o:p>
<U1:P></U1:P><pre wrap=""><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'>
<hr size=4 width="90%" align=center>
</span></font></pre><pre style='text-align:center'><font size=2 color="#333300"
face="Courier New"><span style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre
style='text-align:center'><font size=2 color="#333300" face="Courier New"><span
style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre><font
size=2 color="#333300" face="Courier New"><span style='font-size:10.0pt'><o:p> </o:p></span></font></pre><pre><font
size=2 color="#333300" face="Courier New"><span style='font-size:10.0pt'>_______________________________________________<o:p></o:p></span></font></pre><pre><font
size=2 color="#333300" face="Courier New"><span style='font-size:10.0pt'>jQuery mailing list<o:p></o:p></span></font></pre><pre><font
size=2 color="#333300" face="Courier New"><span style='font-size:10.0pt'><a
href="mailto:discuss@jquery.com">discuss@jquery.com</a><o:p></o:p></span></font></pre><pre><font
size=2 color="#333300" face="Courier New"><span style='font-size:10.0pt'><a
href="http://jquery.com/discuss/">http://jquery.com/discuss/</a><o:p></o:p></span></font></pre><pre><font
size=2 color="#333300" face="Courier New"><span style='font-size:10.0pt'> <o:p></o:p></span></font></pre>
<p class=MsoNormal><font size=3 color="#333300" face="Times New Roman"><span
style='font-size:12.0pt'><o:p> </o:p></span></font>
</div>
</body>
</html>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/