Question

我有以下表格：

<input name="q" value="" class="qa-search-field">
<input type="submit" value="Search" class="qa-search-button">

我试图通过添加类.qa-search-button-active在qa-search-field处于活动状态时更改提交按钮的类，然后在搜索表单不活动时将其删除，这意味着光标不在那里闪烁。

无法弄清楚如何在Jquery中编写代码。

Answer 1

$(".qa-search-field").focusin(function() {
   $('.qa-search-button').addClass('.qa-search-button-active');
});

(".qa-search-field").focusout(function() {
   $('.qa-search-button').removeClass('.qa-search-button-active');
});

Answer 2

$('document').ready(function(){
    $('input[name="q"]').focus(function(event){
        $('input[type="submit"]).attr('class', 'qa-search-button-active');
    });


    $('input[name="q"]').focus(function(event){
        $('input[type="submit"]).attr('class', 'qa-search-button');
    });
});

Answer 3

这个迟到的解决方案怎么样？：）

$(".qa-search-field").focus(function () {
    $('.qa-search-button').removeClass('qa-search-button').addClass('qa-search-button-active');
});

$(".qa-search-field").blur(function () {
    $('.qa-search-button-active').removeClass('qa-search-button-active').addClass('qa-search-button');
});

Jquery表单字段焦点更改提交按钮类

3 个答案: