开发者

Deleting value="Comment?" as soon as it is clicked from the input box

开发者 https://www.devze.com 2023-03-28 18:32 出处:网络
I created an input box and says \"comments?\" before the user enters 开发者_开发问答anything in it.Code;

I created an input box and says "comments?" before the user enters 开发者_开发问答anything in it.Code;

          <input type="text" name="saysome" value = "comments?"/>

But, i want to delete this "comments?" as soon as it is clicked.I am trying to do input box just like the search box in here, actually exaclty same. How can i do that?Can it be done by only javascipt? :(

Thanks


You can use the html5 placeholder attribute found here: HTML5 Specs

For example:

 <input type="text" name="saysome" placeholder = "comments?"/>

You could also take a javascript approach for browsers that do not support HTML5.


Simple method that will clear it anytime the box has focus, and not if the user has entered anything into it

<input type="text" name="TB" value="Please Enter.." onfocus="this.value==this.defaultValue?this.value='':null"/>


As other commenters mentioned, you should check out placeholder. To answer your question though, this method will remove the text on mouse click if the user has not already entered something. This assumes that the id of the input is textbox. You will have to change it to whatever you have or else assign the input an id.

<input id="textbox" type="text"/>

and the JS:

document.getElementById('textbox').onclick = function()
{
    var box = document.getElementById('textbox');
    if(box.value==box.defaulValue)box.value =='';
}


<input type="text" name="saysome" onblur="if(this.value=='') this.value='comments?';" onclick="this.value=''" value="comments?" />

See this example @ http://x.co/Z2pa


Non-jquery:

onClick="clearComments()"

function clearComments() {
    commentInput = document.getElementById("commentsId");
    if(commentInput.value == 'comments?') {
       commentInput.value = '';
    }

}


Without jQuery:

Give the input an ID, and clear its value using an onclick event.

<input type="text" name="test" id="test" value="test" onclick="if(document.getElementById('test').value=='test')document.getElementById('test').value='';">

Also supports older browsers that don't use HTML 5.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号