IE浏览器中使用jQuery对输入框添加/移除属性的技术问题

嘿，这有个简洁的jQuery实现方式，刚好能满足你的需求——当类名为amount的输入框获得焦点时，给它设置placeholder为$0.00；失去焦点时就移除这个placeholder属性。

对应的HTML结构 #

<div class="input-field"> 
 <input id="amount" class="amount" name="amount" type="text" maxlength="15" class="validate" /> 
 <label for="amount">Deposit Amount</label> 
</div>

jQuery实现代码 #

// 输入框获得焦点时设置占位提示
$('.amount').focus(function(){ 
  $(this).attr('placeholder', '$0.00'); 
});

// 输入框失去焦点时移除占位提示
$('.amount').focusout(function(){ 
  $(this).removeAttr('placeholder'); 
});

简单解释下逻辑：

• 我们给所有带有amount类的输入框绑定了focus事件，当用户点击输入框（或者通过Tab键切换到输入框）时，就会触发这个事件，给输入框添加placeholder属性并设置值为$0.00；
• 同时绑定了focusout事件，当用户点击输入框外部或者切换到其他元素导致输入框失去焦点时，就会移除placeholder属性，输入框也就不会再显示这个提示文本了。

内容的提问来源于stack exchange，提问作者RPM