Подтвердить что ты не робот

Текст в поле HTML исчезает при нажатии?

Я могу легко создать поле ввода html, в котором уже есть текст. Но когда пользователь нажимает на поле ввода, текст не исчезает, а остается там. Затем пользователю необходимо вручную удалить текст для ввода. Как я могу создать поле ввода, где, когда пользователь нажимает на поле ввода, текст исчезает?

4b9b3361

Ответ 1

Что вы хотите сделать, это использовать атрибут HTML5 placeholder, который позволяет установить значение по умолчанию для вашего поля ввода:

<input type="text" name="inputBox" placeholder="enter your text here">

Это должно достичь того, что вы ищете. Однако будьте осторожны, поскольку атрибут placeholder не поддерживается в Internet Explorer 9 и более ранних версиях.

Ответ 2

Для этого вы можете использовать два события onfocus и onblur:

<input type="text" name="theName" value="DefaultValue"
  onblur="if(this.value==''){ this.value='DefaultValue'; this.style.color='#BBB';}"
  onfocus="if(this.value=='DefaultValue'){ this.value=''; this.style.color='#000';}"
  style="color:#BBB;" />

Ответ 3

Это так же просто, я думаю, решение, которое должно решить все ваши проблемы:

<input name="myvalue" id="valueText" type="text" value="ENTER VALUE">

Это ваша кнопка отправки:

<input type="submit" id= "submitBtn" value="Submit">

затем поместите этот маленький jQuery в файл js:

//this will submit only if the value is not default
$("#submitBtn").click(function () {
    if ($("#valueText").val() === "ENTER VALUE")
    {
        alert("please insert a valid value");
        return false;
    }
});

//this will put default value if the field is empty
$("#valueText").blur(function () {
    if(this.value == ''){ 
        this.value = 'ENTER VALUE';
    }
}); 

 //this will empty the field is the value is the default one
 $("#valueText").focus(function () {
    if (this.value == 'ENTER VALUE') {
        this.value = ''; 
    }
});

И он работает и в старых браузерах. Кроме того, он может быть легко преобразован в обычный javascript, если вам нужно.

Ответ 4

попробуйте этот вариант.

<label for="user">user</label>
<input type="text" name="user" 
onfocus="if(this.value==this.defaultValue)this.value=''"    
onblur="if(this.value=='')this.value=this.defaultValue" 
value="username" maxlength="19" />

надеюсь, что это поможет.

Ответ 5

Просто, как это: <input type="text" name="email" value="e-mail..." onFocus="this.value=''">

Ответ 6

Как насчет чего-то подобного?

<input name="myvalue" type="text" onfocus="if(this.value=='enter value')this.value='';" onblur="if(this.value=='')this.value='enter value';">

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

Ответ 7

Используйте атрибут заполнителя. Текст исчезает, когда пользователь начинает печатать. Это пример проекта, над которым я работаю:

<div class="" id="search-form">
    <input type="text" name="" value="" class="form-control" placeholder="Search..." >
</div>