如何在取消单击时恢复以前的输入值

How can I get back a former value of input when unclicked?

本文关键字：输入 恢复 取消 单击      更新时间：2023-09-26

好吧，我计划在单击时隐藏输入元素的值，但在其他地方单击时再次显示。

这是我的HTML文件：

<div id="iletisim">
<h2>İletişim</h2>
    <div id="bilgiler">
        <p>info@gmail.com</p>
        <p>211-22-67-09</p>
        <p>New Oakland - CA</p>
    </div>
    <div id = "formlar2">
        <form id="formlar">
            E-POSTA :   <input type="text" name="email" value="eposta adresinizi giriniz">
            TELEFON :   <input type="text" name="telefon" value="telefon numaranızı giriniz">
        </form>
        <textarea rows="10" cols="64">İstek ve şikayetlerinizi buraya yazabilirsiniz!</textarea>
        <input type="submit"></input>
    </div>
    <div id='linkler'>
        <a href='http://www.facebook.com'><img src='images/fb.png'></img></a>
        <a href='http://www.twitter.com'><img src='images/twt.png'></img></a>
        <a href='http://www.instagram.com'><img src='images/in.png'></img></a>
    </div>
</div>

下面是我找到的jquery代码：

$(document).ready(function(){
    $('#formlar2 input , textarea').click(function(){
        $(this).val('');
    });
    $('#iletisim p, #iletisim a, #iletisim h2').click(function(){
      var x = "eposta adresinizi giriniz"
      var y = "telefon numaranızı giriniz"
      var z = "İstek ve şikayetlerinizi buraya yazabilirsiniz!"
      $('#formlar2 input:nth-child(1)').val(x);
      $('#formlar2 input:nth-child(2)').val(y);
      $('textarea').val(z);
   });
});

我完全知道，如果我尝试用这种方式来解决这个问题，那么只有当jquery代码中提到的元素被点击时，原始值才会显示出来。

那么，解决这个问题的方法是什么呢？否则，我必须提到除输入元素之外的所有其他元素。任何想法都会很有帮助，尤其是一条捷径。非常感谢！

如果我做对了，你可以使用blur事件：

$('input, textarea').on('blur', function(){
   //do your stuff here
});

Fiddle

您要查找的特性称为占位符。结账：

  • 使用jQuery修复HTML5占位符输入字段
  • 有关事件的详细信息

链接示例：

$("'[placeholder]'").focus(function() {
  var input = $(this);
  if (input.val() == input.attr("'placeholder'")) {
    input.val("''");
    input.removeClass("'placeholder'");
  }
}).blur(function() {
  var input = $(this);
  if (input.val() == "''" || input.val() == input.attr("'placeholder'")) {
    input.addClass("'placeholder'");
    input.val(input.attr("'placeholder'"));
  }
}).blur();
相关文章：