我创建了一个输入框,在用户输入任何内容之前说"comments?";
<input type="text" name="saysome" value = "comments?"/>
但是,我想在点击后立即删除这个"评论?"。我试着像这里的搜索框一样做输入框,实际上完全一样。我该怎么做?只能通过javascipt完成吗?:(
感谢
您可以使用此处的html5占位符属性:HTML5规范
例如:
<input type="text" name="saysome" placeholder = "comments?"/>
对于不支持HTML5的浏览器,您也可以采用javascript方法。
一个简单的方法,只要框有焦点,就会清除它,而不是如果用户在中输入了任何内容
<input type="text" name="TB" value="Please Enter.." onfocus="this.value==this.defaultValue?this.value='':null"/>
正如其他评论者所提到的,您应该检查占位符。不过,为了回答您的问题,如果用户尚未输入内容,此方法将在鼠标单击时删除文本。这假设输入的id是textbox
。你必须将其更改为你所拥有的任何内容,或者为输入分配一个id。
<input id="textbox" type="text"/>
和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?" />
请参阅此示例@http://x.co/Z2pa
非jquery:
onClick="clearComments()"
function clearComments() {
commentInput = document.getElementById("commentsId");
if(commentInput.value == 'comments?') {
commentInput.value = '';
}
}
没有jQuery:
给输入一个ID,并使用onclick事件清除其值。
<input type="text" name="test" id="test" value="test" onclick="if(document.getElementById('test').value=='test')document.getElementById('test').value='';">
还支持不使用HTML5的旧浏览器。