Question

点击标签后，我能够替换/删除某个输入值，这是我的代码：

$("#labelid").on("click",function() {
    if($("#inputid").val('sometexthere'));
    {
    $("#inputid").val('');
    }
});

每次单击标签时，代码都会删除值sometexthere。我想把它限制为只有一次，所以如果第一次点击标签它会删除该值，如果它第二次点击，它什么也不做（保留值）。

我该怎么做？答案将不胜感激。

Answer 1

使用 .one() 方法。

将处理程序附加到元素的事件。每个事件类型的每个元素最多执行一次处理程序。

$("#labelid").one("click",function() {
    if($("#inputid").val() === 'sometexthere')   // remove the ;
    {
        $("#inputid").val('');
    }
});

val('...')中的if($("#inputid").val('sometexthere'))分配了值，而不是比较 - $("#inputid").val() === '...'。

注意：如果j08691 suggests here与初始文字/占位符相关，请使用<input placeholder="sometexthere"/>

Answer 2

var click = false;
$("#labelid").on("click",function() { 
  if(!click){ 
    if($("#inputid").val('sometexthere'));
    {
           $("#inputid").val(''); 
    }
   click = true;
  }
});

这将有效：）

Answer 3

第一次点击链接后，您可以使用jQuery.off()。我认为占位符是个好主意，但我不知道它是否能完成你想要的东西，如果你需要向后兼容性，你需要一个垫片来处理placeholder属性。我同意接受的答案如果事件处理程序的分离是无条件的。

如果事件处理程序的分离是有条件的，我认为这更清晰：

$("#labelid").on("click",function() { var $input = $("#inputid"); if($input.val().length > 0) { $input.val(''); $(this).off("click"); } });

Answer 4

在您的代码中，$("#inputid").val('sometexthere')始终为true，因为正在发生的事情是为字段设置值。 <{1}}方法返回val对象，因此它基本上是真的。

其中一个解决方案确实是.one方法，它只为事件侦听器分配一次。但是，您可能需要在jQuery事件上执行其他操作。所以我带着一面旗帜：

click

顺便说一下，考虑使用placeholder属性。

Answer 5

如果您已经被论证说服使用占位符，那么这里的示例实现包括don't natively support HTML5 Placeholders（ahem＆lt; = IE9）的浏览器的后备...

＆＃13;

$(function() {
    //test if placeholder is natively supported:
    function hasPlaceholder() {
        var test = document.createElement('input');
        return ('placeholder' in test);
    }
    //if placeholder is not natively supported initialise this method to replicate the behaviour
    if(!hasPlaceholder){
        $('[placeholder]').focus(function() {
            var $this = $(this);
            if ($this.val() == $this.attr('placeholder')) {
                $this.val('')
                     .removeClass('placeholder');
            }
        }).blur(function() {
            var $this = $(this);
            if ($this.val() == '' || $this.val() == $this.attr('placeholder')) {
                $this.addClass('placeholder')
                     .val($this.attr('placeholder'));
            }
        }).blur();
        //on submit, make sure we remove any fo placeholder values
        $('[placeholder]').parents('form').submit(function() {
            $(this).find('[placeholder]').each(function() {
                var $this = $(this);
                if ($this.val() == $this.attr('placeholder')) {
                    $this.val('');
                }
            })
        });
    }
});

＆＃13;

/* You can style placeholders... */
input.placeholder {color:#66aaee;}
::-webkit-input-placeholder {color: #66aaee;}
:-moz-placeholder {color: #66aaee;}
::-moz-placeholder {color: #66aaee;}
:-ms-input-placeholder {color: #66aaee;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>Label: <input name="inputname" id="inputid" placeholder="this is the placeholder" /></label>

＆＃13;

仅替换输入值一次

5 个答案: