如何刪除焦點上輸入的默認值

我有一個輸入框，它具有分配給它的默認值文本。我怎麼能當用戶的重點領域::如何刪除焦點上輸入的默認值

代碼刪除該文本

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

來源

2010-09-27 user342391

這不是一個答案，但在未來它將是http://dev.w3.org/html5/spec/Overview.html#the-placeholder-attribute – Galen 2010-09-27 18:10:12

可能的重複[刪除輸入文本的默認值在點擊]（http://stackoverflow.com/questions/2984311/delete-default-value-of-an-input-text-on-click） – ripper234 2012-01-02 05:25:14

$(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(); 
})

來源

2010-09-27 17:33:40 RobertPitt

如果沒有輸入任何內容，值不會重新顯示。 – user342391 2010-09-27 17:40:40

更新，讓我知道，如果這樣的作品。 – RobertPitt 2010-09-27 17:43:06

怪怪的仍然沒有 – user342391 2010-09-27 17:46:23

不要做這種方式。使用jQuery水印腳本： http://code.google.com/p/jquery-watermark/

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

如果您手動執行操作，則需要考慮很多事項。例如，當文本框失去焦點時會發生什麼？如果沒有價值，你會想讀你的幫手文本。如果有的話，你會想要兌現這些變化。

只是更容易讓別人做繁重的:)

來源

2010-09-27 17:27:42 clifgriffin

，但使用一個簡單的任務整個庫不是最好的主意。 – RobertPitt 2010-09-27 17:29:58

的確，我只是認爲這個輪子不需要重新設計。有許多場景需要考慮，使用庫可以簡化很多。他用jQuery標記了他的問題，所以使用jQuery插件可能是完成此任務最實用的方法。 – clifgriffin 2010-09-27 17:33:45

+1代碼重用。有些問題很難，應該由圖書館來解決，而不是由地球上的每個編碼猴重新實施。談到JavaScript時，人們對此特別不滿。 – Sorpigal 2010-09-27 18:00:38

使用HTML5，您可以在不使用Javascript的情況下使用它：只需使用placeholder而不是value即可。我認爲這是一個很好的補充，但是當然你需要首先檢查瀏覽器的兼容性。

來源

2012-07-28 04:06:09 pera

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>

這一切，我希望對大家有所幫助。

來源

2012-11-24 09:15:34 Dhaval

var defaultForInput = "abc";

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

當提交表單，檢查輸入（ID = 「myTextInput」）值是 '空字符串'，如果是用替代它（defaultForInput）。

來源

2013-07-08 19:24:14 Bennj

$('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); 
    }); 
});

來源

2014-04-13 19:03:28 bruno

將超酷短版

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

來源

2014-09-08 22:14:47 Abram

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

我認爲這將有助於

來源

2014-11-20 13:58:22 kkk

普通的JavaScript：

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

這使得在價值佔位符而不是完全刪除它。如果您不喜歡這樣，請刪除佔位符行。

來源

2017-12-08 15:03:31 ceving

如何刪除焦點上輸入的默認值

回答

相關問題