Заполнитель HTML5 textarea не отображается

Я не могу понять, что не так с моей разметкой, но заполнитель для текстовой области не появится. Кажется, он может быть покрыт пробелами и вкладками. Когда вы фокусируетесь на текстовой области и удаляете ее, где находится курсор, затем оставьте текстовую область, затем появится соответствующий заполнитель.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
    <head>
    </head>

    <body>

    <form action="message.php" method="post" id="message_form">
        <fieldset>

            <input type="email" name="email" id="email" title="Email address"
                maxlength="40"
                placeholder="Email Address" 
                autocomplete="off" required />
            <br />
            <input type="text" 
                name="subject" 
                id="subject" title="Subject"
                maxlength="60" placeholder="Subject" autocomplete="off" required />
            <br />
            <textarea name="message" 
                id="message" 
                title="Message" 
                cols="30" 
                rows="5" 
                maxlength="100" 
                placeholder="Message" required>
            </textarea>
            <br />
            <input type="submit" value="Send" id="submit"/>

        </fieldset>
    </form>
</body>

<script>

$(document).ready(function() {        
    $('#message_form').html5form({
        allBrowsers : true,
        responseDiv : '#response',
        messages: 'en',
        messages: 'es',
        method : 'GET',
        colorOn :'#d2d2d2',
        colorOff :'#000'
    }
);
});

</script>

</html>

Ответ 1

Этот всегда был для меня и многих других. Короче говоря, теги открытия и закрытия для элемента <textarea> должны быть в одной строке, иначе символ новой строки занимает его. Поэтому местозаполнитель не будет отображаться, так как область ввода содержит контент (символ новой строки - это технически допустимый контент).

Хорошо:

    <textarea></textarea>

Плохо:

    <textarea>
    </textarea>

Ответ 2

Удалить все пробелы и разрывы строк между <textarea> открытием и закрытием тегов </textarea>.

<textarea placeholder="YOUR TEXT"></textarea>  ///Correct one

<textarea placeholder="YOUR TEXT"> </textarea>  ///Bad one It treats as a value so browser won't display the Placeholder value

<textarea placeholder="YOUR TEXT"> 
</textarea>  ///Bad one

Ответ 3

его, потому что где-то есть место. Я использовал jsfiddle, и после тега было пробел. После того как я удалил пробел, он начал работать

Ответ 4

Ну, технически это не должно быть в одной строке, пока не существует символа между окончанием " > " от начального тега и начальным "<" из закрывающего тега. То есть вам нужно закончить ...></textarea>, как в примере ниже:

<p><label>Comments:<br>
       <textarea id = "comments" rows = "4" cols = "36" 
            placeholder = "Enter comments here"
            class = "valid"></textarea>
    </label>
</p>

Ответ 5

используйте <textarea></textarea> вместо того, чтобы оставлять пробел между открывающими и закрывающими тегами как <textarea> </textarea>

Ответ 6

У меня была такая же проблема, только с использованием файла .pug (похожего на .jade). Я понял, что это также проблема пространства, после окончания моих заключительных круглых скобок. В моем примере вам нужно выделить текст после (placeholder="YOUR MESSAGE"), чтобы увидеть:

ДО:

form.form-horizontal(method='POST')
  .form-group
    textarea.form-control(placeholder="YOUR MESSAGE") 
  .form-group  
    button.btn.btn-primary(type='submit') SUBMIT

ПОСЛЕ:

form.form-horizontal(method='POST')
  .form-group
    textarea.form-control(placeholder="YOUR MESSAGE")
  .form-group  
    button.btn.btn-primary(type='submit') SUBMIT

Ответ 7

Между тегом открытия и закрытия в нашем случае тег textarea не должен быть пробел или символ новой строки или любой текст (значение).

Если есть пробел, символ новой строки или любой текст, он считается значением, которое переопределяет местозаполнитель.

    **PlaceHolder Appears**
    <textarea placeholder="Am Default Message"></textarea>

    **PlaceHolder Doesn't Appear**

    <textarea placeholder="Am Default Message">  </textarea>
   <textarea placeholder="Am Default Message"> 
   </textarea>
   <textarea placeholder="Am Default Message">Something</textarea>