Как удалить значение по умолчанию для ввода фокуса

Question

У меня есть окно ввода, которому присвоен текст значения по умолчанию. Как я могу удалить этот текст, когда пользователь фокусируется на поле ::

КОДЕКСА

<input type="text" name="kp1_description" value="Enter Keypress Description"> 

Answer 1

$(document).ready(function(){ 
    var Input = $('input[name=kp1_description]'); 
    var default_value = Input.val(); 

    Input.focus(function() { 
     if(Input.val() == default_value) Input.val(""); 
    }).blur(function(){ 
     if(Input.val().length == 0) Input.val(default_value); 
    }); 
})​ 

Это должно сделать это.

Обновлено, забывали, что фокус не имеет 2-й параметр для фокусировки-аута, потому что его нет, он должен быть прикован с размытием:

http://jsfiddle.net/hDCsZ/

вы также должны думать о создании Вашего собственные функции для этого, таких как:

$.fn.ToggleInputValue = function(){ 
    return $(this).each(function(){ 
     var Input = $(this); 
     var default_value = Input.val(); 

     Input.focus(function() { 
      if(Input.val() == default_value) Input.val(""); 
     }).blur(function(){ 
      if(Input.val().length == 0) Input.val(default_value); 
     }); 
    }); 
} 

Затем используйте как так

$(document).ready(function(){ 
    $('input').ToggleInputValue(); 
})​ 

Answer 2

Не делать это таким образом. Использовать сценарий водяных знаков jQuery: http://code.google.com/p/jquery-watermark/

$("input[name='kp1_description']").watermark("Enter Keypress Description");

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

Просто легче позволить другим людям делать тяжелую :)

Answer 3

С HTML5 вы можете сделать это без Javascript: просто используйте placeholder вместо value. Я думаю, что это приятное дополнение, но, конечно, сначала вам нужно проверить совместимость браузера.

Answer 4

HTML:

<form method="post"> 
    <input type="text" id="customer" value="Username"/>  
    <input type="Submit" value="Login" class="rc" /> 
</form> 

код Javascript:

<script> 
$('#customer').on({ 
    focus:function(){     
     if(this.value == 'Username') this.value = ''; 
    }, 
    blur:function(){ 
     if(this.value == '') this.value = 'Username'; 
    } 
}) 
</script> 

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

Answer 5

var defaultForInput = "abc";

<input id="myTextInput" type="text" placeholder=defaultForInput />

---

При отправке формы, проверьте, если вход (= идентификатор "myTextInput") значением является 'пустая строка', если так заменить его (defaultForInput) ,

Answer 6

$('input, textarea').each(function() { 
    var Input = $(this); 
    var default_value = Input.val(); 

    Input.focus(function() { 
     if(Input.val() == default_value) Input.val(""); 
    }).blur(function(){ 
     if(Input.val().length == 0) Input.val(default_value); 
    }); 
}); 

Answer 7

Супер пупер Короткая версия

$('#input_id').focus(function() { 
    $(this).val(""); 
}); 

Answer 8

<input type="text" id="anything" placeholder="enter keypress description"> 

я думаю, что это поможет

Answer 9

Plain JavaScript:

(function() { 
    let input = document.querySelector ("input[name='kp1_description']"); 
    input.onfocus = function() { 
    this.placeholder = this.value; 
    this.value = ''; 
    }; 
})(); 

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