Question

我的网站上有一个联系表单，其中的文本开始呈浅灰色，点击后我将其设置为更改颜色，但是当我选中它时没有。是否可以检测用户是否使用了标签按钮进入字段而不是单击并覆盖此实例。

HTML：

<input name="email" type="text" id="EmailField" class="extraFields" autocomplete="off">

jQuery的：

 $('body').on('click', '.extraFields', function () {
     $(this).addClass('clickedField');
 });

CSS：

.extraFields{
     color:#cccccc;
}
.clickedField{
     color:#000000 !important;
}

Answer 1

使用焦点事件而不是点击：

$('body').on('focus', '.extraFields', function () {
    $(this).addClass('clickedField');
});

Answer 2

这里的问题是事件监听器附加到页面的body元素，因此$(this)引用它。要在字段本身上设置类，请使用e.target：

// add class on focus
$('body').on('focus', '.extraFields', function (event) {
    $(event.target).addClass('clickedField');
});
// remove class on blur
$('body').on('blur', '.extraFields', function (event) {
    $(event.target).removeClass('clickedField');
});

请参阅http://api.jquery.com/event.target/

单击或选项卡上的表单字段文本颜色更改

2 个答案: