Question

嗨，我在输入文本中输入了值，我想当它获得焦点时，值隐藏（例如占位符）我知道我们有占位符，但是我有不同的项目，所以我不能使用占位符

有什么方法可以使用CSS，jQuery等吗？

Answer 1

如何添加点击事件监听器？

例如）

HTML

<input type="text" id="myInput" value="Some text" />

JS

let myInput = document.getElementById("myInput");

myInput.addEventListener("click", function() {
  this.value = "";
});

JSFiddle：https://jsfiddle.net/ju7xervp/1/

Answer 2

您可以使用onfous的初始化值：onfocus="value=''"

<input value="hello" onfocus="value=''"/>

Answer 3

$('.hide-on-focus').focus(function() {
  if(!$(this).attr('data-value') || $(this).val() === $(this).attr('data-value')) {
    $(this).attr('data-value', $(this).val());
    $(this).val('');
  }
}).blur(function() {
  if($(this).val()==='') {
    $(this).val($(this).attr('data-value'));
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="hide-on-focus" value="Not a placeholder" />

希望这对您有所帮助：）

Answer 4

您可以使用data属性在其中存储占位符文本和输入值。因此，在输入焦点上，将输入值存储在data-val中，并在输入中显示data-place的内容

$("input").focus(function(){
  this.value = $(this).attr("data-val");
}).blur(function(){
  $(this).attr("data-val", this.value);
  this.value = $(this).attr("data-palce");
}).trigger("blur");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" data-val="" data-palce="Placeholder text">

Answer 5

只需使用getElementByid或$（“＃id-of-related-input”）来获取输入查询，然后使用text（“”）或val（“”）将其文本设置为“”。

Answer 6

最简单的方法就是这个

<input value="hello" onfocus="value=''" onfocusout="value='hello'" />

如何使用CSS / javascript / jquery隐藏焦点上的输入值？

6 个答案: