put the value back in the input (Beginner)
|
View:
New views
6 Messages
—
Rating Filter:
Alert me
|
|
|
put the value back in the input (Beginner)Hello I managed to do sucessfully: $(document).ready(function(){ $("#schnellsuche input").focus(function () { $(this).val(""); }); }); <form action="" id="schnellsuche"> <input class="text" type="text" value="Schnellsuche" /> </form> I'm so proud of me ;-) now I want the default value back in, when the focus is not anymore in the input textbox. Can someone put me in the right direction? thx |
|
|
Re: put the value back in the input (Beginner)tlob wrote: > $(document).ready(function(){ > $("#schnellsuche input").focus(function () { > $(this).val(""); > }); > }); > now I want the default value back in, when the focus is not anymore in > the input textbox. Can someone put me in the right direction? From memory (so it might need tweaking....) you need to chain another event to your code up there: $(document).ready(function(){ $("#schnellsuche input").focus(function () { $(this).val(""); }).blur(function() { if ($(this).val() == "") { $(this).val($(this)[0].defaultValue); } }); }); This adds a blur event that says if the value is empty, restore it to the element's default value. Hope this helps. :) Regards, Michael Price |
|
|
Re: put the value back in the input (Beginner)works like a charm! but I dont get it... -blur is the opposite of focus, right? -why do you chain it after the focus? -with [0].defaultValue you restore the first value that was stored in an array? -does JS store every changed value of every element in an array? thx a lot! On Feb 15, 3:32 pm, Michael Price <m...@...> wrote: > tlob wrote: > > $(document).ready(function(){ > > $("#schnellsuche input").focus(function () { > > $(this).val(""); > > }); > > }); > > now I want the default value back in, when the focus is not anymore in > > the input textbox. Can someone put me in the right direction? > > From memory (so it might need tweaking....) you need to chain another > event to your code up there: > > $(document).ready(function(){ > $("#schnellsuche input").focus(function () { > $(this).val(""); > }).blur(function() { > if ($(this).val() == "") { > $(this).val($(this)[0].defaultValue); > } > }); > > }); > > This adds a blur event that says if the value is empty, restore it to > the element's default value. > > Hope this helps. :) > > Regards, > Michael Price |
|
|
Re: put the value back in the input (Beginner)tlob wrote: > works like a charm! Excellent :) > but I dont get it... > -blur is the opposite of focus, right? Yep - focus is triggered when the user tabs or clicks into the input - blur is triggered when they tab or click out of it so it's no longer the active element. > -why do you chain it after the focus? 'tis the jQuery way! What we're basically doing is saying "with the input in #schnellsuche, add a focus handler, then add a blur handler". > -with [0].defaultValue you restore the first value that was stored in > an array? Not quite. If you imagine $(this) as an array of DOM objects within jQuery, then $(this)[0] is a way to access the first (or in this case, only) DOM object. jQuery doesn't have a built in way to retrieve the default value of an input, so we have to nip back into the DOM momentarily in order to retrieve it. > -does JS store every changed value of every element in an array? The DOM contains a defaultValue attribute for every text input, textarea and select box. Not sure about checkboxes and radio buttons. I invite other people to clear up any parts of my reply which aren't totally accurate (you can tell I have faith in my ability to explain things properly, I must say this in every post!) Regards, Michael Price |
|
|
Re: put the value back in the input (Beginner)Hey, I extended your example code to add a blur function. You can add an if statement in the blur function if you need to restore the default only in certain cases (like only if $(this).val() == "") $(document).ready(function(){ $("#schnellsuche input") .focus(function () { $(this).val(""); }) .blur(function() { $(this).val("Schnellsuche"); }); }); - Jamie Goodfellow On Feb 15, 9:28 am, tlob <tlohb...@...> wrote: > Hello > > I managed to do sucessfully: > > $(document).ready(function(){ > $("#schnellsuche input").focus(function () { > $(this).val(""); > }); > > }); > > <form action="" id="schnellsuche"> > <input class="text" type="text" value="Schnellsuche" /> > </form> > > I'm so proud of me ;-) > > now I want the default value back in, when the focus is not anymore in > the input textbox. Can someone put me in the right direction? > > thx |
|
|
Re: put the value back in the input (Beginner)$('#ANinputID').attr('defaultValue') works in my IE :) On Feb 15, 11:09 pm, Michael Price <m...@...> wrote: > tlob wrote: > > works like a charm! > > Excellent :) > > > but I dont get it... > > -blur is the opposite of focus, right? > > Yep - focus is triggered when the user tabs or clicks into the input - > blur is triggered when they tab or click out of it so it's no longer the > active element. > > > -why do you chain it after the focus? > > 'tis the jQuery way! What we're basically doing is saying "with the > input in #schnellsuche, add a focus handler, then add a blur handler". > > > -with [0].defaultValue you restore the first value that was stored in > > an array? > > Not quite. If you imagine $(this) as an array of DOM objects within > jQuery, then $(this)[0] is a way to access the first (or in this case, > only) DOM object. jQuery doesn't have a built in way to retrieve the > default value of an input, so we have to nip back into the DOM > momentarily in order to retrieve it. > > > -does JS store every changed value of every element in an array? > > The DOM contains a defaultValue attribute for every text input, textarea > and select box. Not sure about checkboxes and radio buttons. > > I invite other people to clear up any parts of my reply which aren't > totally accurate (you can tell I have faith in my ability to explain > things properly, I must say this in every post!) > > Regards, > Michael Price |
| Free embeddable forum powered by Nabble | Forum Help |