Question

我输入了标签就在哪里（如占位符），如果我写入输入，则标签获得class =＆＃34; active＆＃34;。（这有效）

但如果已经有价值=＆＃34;测试＆＃34;然后它必须自动标记class =＆＃34; active＆＃34;。

我的代码：

$('.data').find('input, textarea').on('keyup blur focus', function (e) {
    var $this = $(this),
        label = $this.prev('label');

    if ($this.val() === '') {
        label.removeClass('active highlight');
    } else {
        label.addClass('active highlight');
    }

    if ($this.val() === '') {
        label.removeClass('active highlight');
    } else {
        label.removeClass('highlight');
    }

    if ($this.val() === '') {
        label.removeClass('highlight');
    } else if ($this.val() !== '') {
        label.addClass('highlight');
    }
});

并且此代码仅适用于keyup。

$('.data').find('input, textarea').on('keyup blur focus', function (e) {
    var $this = $(this),
        label = $this.prev('label');

    if (e.type === 'keyup') {
        if ($this.val() === '') {
            label.removeClass('active highlight');
        } else {
            label.addClass('active highlight');
        }
    } else if (e.type === 'blur') {
        if ($this.val() === '') {
            label.removeClass('active highlight');
        } else {
            label.removeClass('highlight');
        }
    } else if (e.type === 'focus') {
        if ($this.val() === '') {
            label.removeClass('highlight');
        } else if ($this.val() !== '') {
            label.addClass('highlight');
        }
    }
});

此时如果输入值=＆＃34;测试＆＃34;如果我单击输入然后它会激活类，但我需要它自动添加。

Answer 1

在页面加载后立即触发keyup事件，自动添加active类，如下所示。

$('.data').find('input, textarea').on('keyup blur focus', function (e) {
    //your code
}).keyup();

Answer 2

如果我单击输入然后它会激活类，但我需要自动添加它。

这很简单，只需触发您正在观看的其中一项活动：

$('.data').find('input,textarea').trigger('keyup')

同时，您的功能不必要地重复;没有必要单独处理你正在观看的三个事件中的每一个，因为他们都在做同样的事情。您可以将其减少到

$('.data').find('input, textarea').on('keyup blur focus', function (e) {
  var $this = $(this),
      label = $this.prev('label');
  if ($this.val() === '') {
    label.removeClass('active highlight');
  } else {
    label.addClass('active highlight');
  }
}).trigger('keyup');

...或者更好，只需使用change活动，因为这与您尝试做的事情最相关。

jquery如果value不为空则添加活动类

2 个答案: