Question

我想为html <textarea>设置默认值。我从一个材料中读到，要添加默认值，您必须执行<textarea>This is default text</textarea>之类的操作。我这样做但它不起作用。什么是正确的做法？

Answer 1

这是我的jsFiddle示例。这很好用：

<textarea name='awesome'>Default value</textarea>

Answer 2

您可以使用placeholder Attribute，它不会添加默认值，但可能正是您要关注的内容：

<textarea placeholder="this text will show in the textarea"></textarea>

在这里查看 - http://jsfiddle.net/8DzCE/949/

重要提示（正如Jon Brave在评论中所建议的那样）：

占位符属性未设置textarea的值。而不是＆＃34;占位符属性表示一个简短的提示（一个单词或短语），用于在控件没有值时帮助用户输入数据。 [一旦用户点击进入textarea，它就会消失]。它永远不会作为＆＃34;默认值＆＃34;为了控制。如果你想要，你必须把所需的文字放在这里是实际的默认值，按照其他答案

Answer 3

如果要将数据库中的信息带入textarea标记进行编辑：输入标记不显示占用多行的数据：行无效，标记输入为一行。

<!--input class="article-input" id="article-input" type="text" rows="5" value="{{article}}" /-->

textarea标签没有值，但可以使用把手

<textarea class="article-input" id="article-input" type="text" rows="9" >{{article}}</textarea>

Answer 4

如果您在项目中使用 Angular.js （就像我一样）并为ng-model设置了<textarea>，请设置默认值像：

<textarea ng-model='foo'>Some default value</textarea>

...无效！

您需要将默认值设置为相应控制器中的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 = angular.module('myApp',[]);

myApp.controller('MyCtrl', [ '$scope', function($scope){
  $scope.foo = 'Some default value';
}]);

<!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-model='foo'></textarea>
    </div>
  </body>
</html>

Answer 5

当我做这样的事情时，它对我有用：

<textarea name="test" rows="4" cols="6">My Text</textarea>

Answer 6

此外，这对我来说非常有效：

<textarea class="form-control" rows="3" name="msg" placeholder="Your message here." onfocus='this.select()'>
<?php if (isset($_POST['encode'])) { echo htmlspecialchars($_POST['msg']);} ?>
</textarea>

在这种情况下，$ _POST ['encode']来自：

<input class="input_bottom btn btn-default" type="submit" name="encode" value="Encode">

PHP代码插在和标签之间。

Answer 7

一些注释和说明：

placeholder=''会插入您的文字，但它会显示为灰色（采用工具提示样式格式），单击该字段时，您的文字会被空文本字段替换。
value=''不是<textarea>属性，仅适用于<input>代码，即<input type='text'>等。我不知道为什么HTML5的创建者决定不加入它，但这就是现在的方式。
此处已正确概述了将文本插入<textarea>元素的最佳方法：<textarea> Desired text to be inserted into the field upon page load </textarea>当用户点击该字段时，他们可以编辑文本并保留在字段中（与placeholder=''不同）。
注意：如果您在<textarea>和</textarea>标记之间插入文字，则无法使用placeholder=''，因为它会被插入的文字覆盖。

Answer 8

占位符无法设置文本区域的默认值。你可以使用

<textarea rows="10" cols="55" name="description"> /*Enter default value here to display content</textarea>

如果您将其用于数据库连接，那么这是标记。如果您使用的是php以外的其他语言，则可以使用不同的语法。对于php：

e.g：

<textarea rows="10" cols="55" name="description" required><?php echo $description; ?></textarea>

必需命令可以最大限度地减少使用php检查空字段所需的工作量。

Answer 9

您可以使用this.innerHTML。

＆＃13;

<textarea name="message" rows = "10" cols = "100" onfocus="this.innerHTML=''"> Enter your message here... </textarea>

＆＃13;

当文本区域被聚焦时，它基本上使得textarea的innerHTML成为空字符串。

Answer 10

请注意，如果您对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的开始和结束标记之间的文本不同。

Answer 11

您还可以添加“值”属性并进行设置，如下所示：


<textarea value="your value"> </textarea>

如何为html <textarea>？</textarea>添加默认值

11 个答案: