Placeholder for Search-Textbox

问题:

I belive anybody knows this Placeholder-Behaviour for Search-Textboxes. When the page is loaded there is a string in it like "search here..." and as soon the user klicks into the TextBox the string diappears and it appears again if the user didn't insert somethink as soon as the user klick out this textbox.

At the moment I use the JQuery Placeholder-Plugin to realize that in my ASP.Net-Page.

I heave a questions, maybe the Plugin doesn't support what I want, maybe it does, don't know:

I will have a Image within the Textbox instead of a string for the playceholder-text. (Background is, the TextBox is a Google-Search and I want to have the nice colored Google-text instead of a boring single-color "search with google here..:").

Any ideas?

回答1:

I wrote a plugin for this in JQuery which, for giggles, I released here: Jquery Plugin page.

For some reason I called it default box. That's because it uses the dom default value of the textbox. Maybe this will help you?

回答2:

Try this Html :<input type="text" />

css : input{ background: url(http://profile.ak.fbcdn.net/hprofile-ak-prn1/71158_111108655596607_6920099_n.jpg) no-repeat left top }

Javascript : $('input:text').keyup(function (e) { $(this).css('background', 'none'); if($(this).val() == ""){ $(this).css('background', 'url(http://profile.ak.fbcdn.net/hprofile-ak-prn1/71158_111108655596607_6920099_n.jpg) no-repeat left top'); } }); I hope work perfectly kovu.

文章来源: Placeholder for Search-Textbox