我想为我的html <textarea>设置一个默认值。我从材料中读到,要添加默认值,你必须做一些事情,如<textarea>这是默认文本</textarea>。我试过了,但没用。正确的做法是什么?
当前回答
请注意,如果你对文本区域做了更改,在它渲染后;您将得到更新的值,而不是初始化的值。
<!doctype html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
$(function () {
$('#btnShow').click(function () {
alert('text:' + $('#addressFieldName').text() + '\n value:' + $('#addressFieldName').val());
});
});
function updateAddress() {
$('#addressFieldName').val('District: Peshawar \n');
}
</script>
</head>
<body>
<?php
$address = "School: GCMHSS NO.1\nTehsil: ,\nDistrict: Haripur";
?>
<textarea id="addressFieldName" rows="4" cols="40" tabindex="5" ><?php echo $address; ?></textarea>
<?php echo '<script type="text/javascript">updateAddress();</script>'; ?>
<input type="button" id="btnShow" value='show' />
</body>
</html>
正如你所看到的,textarea的值将不同于关注textarea的开始和结束标记之间的文本。
其他回答
你可以使用占位符属性,它不添加默认值,但可能是你正在寻找的:
<textarea placeholder="this text will show in the textarea"></textarea>
点击这里查看- http://jsfiddle.net/8DzCE/949/
重要提示(Jon Brave在评论中建议):
占位符属性不设置文本区域的值。相反,“占位符属性代表了一个简短的提示(一个单词或短语),旨在帮助用户在控件没有值时输入数据”[并且一旦用户单击进入文本区域,它就会消失]。它永远不会作为控件的“默认值”。如果你想这样做,你必须把想要的文本放在这里是实际的默认值,就像这里的其他答案一样
你也可以添加"value"属性并设置如下:
<textarea value="your value"> </textarea>
下面是我的jsFiddle示例。这很好:
<textarea name='awesome'>Default value</textarea>
几点注意事项和澄清:
placeholder='' inserts your text, but it is greyed out (in a tool-tip style format) and the moment the field is clicked, your text is replaced by an empty text field. value='' is not a <textarea> attribute, and only works for <input> tags, ie, <input type='text'>, etc. I don't know why the creators of HTML5 decided not to incorporate that, but that's the way it is for now. The best method for inserting text into <textarea> elements has been outlined correctly here as: <textarea> Desired text to be inserted into the field upon page load </textarea> When the user clicks the field, they can edit the text and it remains in the field (unlike placeholder=''). Note: If you insert text between the <textarea> and </textarea> tags, you cannot use placeholder='' as it will be overwritten by your inserted text.
以防万一,如果你在你的项目中使用Angular.js(就像我一样),并为你的<textarea>设置了ng-model,在里面设置默认值如下:
<textarea ng-model='foo'>Some default value</textarea>
...不会起作用!
您需要在相应的控制器中将缺省值设置为文本区域的ng-model或使用ng-init。
例1(使用ng-init):
var myApp = angular.module('myApp',[]); myApp.controller('MyCtrl', [ '$scope', function($scope){ // your controller implementation here }]); <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> <meta charset="utf-8"> <title>JS Bin</title> </head> <body ng-app='myApp'> <div ng-controller="MyCtrl"> <textarea ng-init='foo="Some default value"' ng-model='foo'></textarea> </div> </body> </html>
例2(不使用ng-init):
var myApp = angsnake .模块(“myApp”); myApp。控制器(“MyCtrl”,[“$scope”,function($scope) 美元的范围。foo =一些默认值; }); < !DOCTYPE html > < > html < head > <剧本剧本src = " https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js " > < / > <元charset = utf-8”> <片名本< - > JS头衔> < / head > <车身ng-app =“myApp > < div ng-controller = MyCtrl”> < textarea ng-model =“foo”> < / textarea > < / div > < / body > < / html >