Javascript 单击后清除 TEXTAREA 值（onFocus）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5033044/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Clear TEXTAREA value after click (onFocus)
提问by Jeff
I'm currently using..
我目前正在使用..
onfocus="this.value=''; return false;"
to clear the value within my textarea for leaving comments. However, when you click to enter a comment and type a few things, if you were to click outside the box to maybe read something else on the page and then return to your comment by clicking within the textarea box again, it clears your current input.
清除我的 textarea 中的值以留下评论。但是，当您单击以输入评论并键入一些内容时，如果您要在框外单击以阅读页面上的其他内容，然后再次单击 textarea 框返回到您的评论，则会清除您当前的输入.
Is there anyway to clear the textarea on the initial click just to clear the default value and not the rest of the clicks for the rest of the browser page's session?
是否有在初始点击时清除 textarea 只是为了清除默认值而不是浏览器页面会话其余部分的其余点击？
回答by methodofaction
It's better to put instructions into a label tag, position it over the textarea, and then hide it or show it if the textarea is focused. The reason for this is because your textearea will be populated with instructions and these might get sent if they are inside a form.
最好将指令放入标签标签中，将其放置在 textarea 上方，然后在 textarea 获得焦点时隐藏或显示它。这样做的原因是因为您的 textearea 将填充说明，如果它们在表单内，则可能会发送这些说明。
But, solve your problem, all you have to do is:
但是，解决您的问题，您所要做的就是：
onfocus="if(this.value== "your initial text"){this.value=''}; return false;"
回答by Liquinaut
I think it's a good habit to seperate the logic from the content. So, using jQuery (we all use jQuery, do we?) you could do:
我认为将逻辑与内容分开是一个好习惯。所以，使用 jQuery（我们都使用 jQuery，是吗？）你可以：
$(document).ready(function() {
var _bCleared = false;
$('form textarea').each(function()
{
var _oSelf = $(this);
_oSelf.data('bCleared', false);
_oSelf.click(function()
{
if (!_oSelf.data('bCleared'))
{
_oSelf.val('');
_oSelf.data('bCleared', true);
}
});
});
});
This will iterate over all the textareas on the site and store a boolean value about their clear state in a seperate data binding. The onclick event is also handled separately for each textarea, so you can have multiple textarea / textarea clearings on a single page and no need for Javascript splattering your html.
这将遍历站点上的所有文本区域，并在单独的数据绑定中存储有关其清除状态的布尔值。onclick 事件也为每个 textarea 单独处理，因此您可以在单个页面上有多个 textarea / textarea 清除，而无需 Javascript 飞溅您的 html。
回答by Adriana Adrie Silva
Instead, use HTML5's placeholderand use a jquery plugin for older browsers.
相反，使用HTML5的placeholder和使用旧版本浏览器jQuery插件。
Running example here: http://jsfiddle.net/dream2unite/xq2Cx/
在这里运行示例：http: //jsfiddle.net/dream2unite/xq2Cx/
<input type="text" name="email" id="email" placeholder="[email protected]">
must be accompanied by the following script:
必须附有以下脚本：
$('input[placeholder], textarea[placeholder]').placeholder();
When you enter an email your text (placeholder) will disappear, only when you delete your email will the text (placeholder) reappear.
当您输入电子邮件时，您的文本（占位符）将消失，只有当您删除电子邮件时，文本（占位符）才会重新出现。
And finally, an obviously good example of a jquery plugin for placeholders is this one: http://mathiasbynens.be/demo/placeholder
最后，占位符的 jquery 插件的一个明显很好的例子是这个：http: //mathiasbynens.be/demo/placeholder
回答by Derek Prior
<script type="text/javascript">
function clearOnInitialFocus ( fieldName ) {
var clearedOnce = false;
document.getElementById( fieldName ).onfocus = (function () {
if (clearedOnce == false) {
this.value = '';
clearedOnce = true;
}
})
}
window.onload = function() { clearOnInitialFocus('myfield');
</script>
Source: http://snipplr.com/view/2206/clear-form-field-on-first-focus/
来源：http: //snipplr.com/view/2206/clear-form-field-on-first-focus/
回答by Justin
I know this is late, but to anyone else having this problem I believe the simplest answer is
我知道这已经晚了，但是对于遇到此问题的其他人，我相信最简单的答案是
onfocus="this.value=''; this.onfocus='';"
onfocus="this.value=''; this.onfocus='';"
should do exactly what you want without having to store/check any variables.
应该做你想做的，而不必存储/检查任何变量。
回答by naiquevin
this will help
这会有所帮助
function clearTA {
if(this.value != "type here") {
this.value = '';
return false;
}
}
and onfocus html attribute
和 onfocus html 属性
...onfocus="clearTA()"..
回答by bryon
So I take it you have a prefilled value such as "Enter your text here"? Try adding this javascript:
所以我认为您有一个预填充的值，例如“在此处输入您的文本”？尝试添加此 javascript：
function clearText(textarea,prefilled){
if(textarea.value==prefilled)
textarea.value="";
return false;
}
Then, your input should be: Enter your text here
然后，您的输入应该是：在此处输入您的文本
This should get you started...
这应该让你开始......
回答by Sem Vanmeenen
Declare a variable clearedOncein javascript that is false. In your onfocus, check this variable. If it is false, then set it to true and clear your textarea. All later clicks will do nothing. Code :
clearedOnce在 javascript 中声明一个错误的变量。在你的焦点中，检查这个变量。如果为假，则将其设置为真并清除您的文本区域。以后的所有点击都不会执行任何操作。代码 ：
onfocus='if (!clearedOnce) { this.value = ''; clearedOnce = true;} return false;'
回答by gergi
You could use a global page var.
您可以使用全局页面变量。
In a scriptelement above the element
在script元素上方的元素中
var tracker = {};
Later...
之后...
<textarea name="a" onfocus="if(!tracker[this.name]) { tracker[this.name]=true; this.value=''; } return false;">Placeholder text</textarea>
