如何用一定的值改变输入的颜色

Question

我想更改页面上任何输入的颜色，其值为“--Select--”。以下代码适用于模糊：

setTimeout(() => {
            $(document).ready(function () {
               $('input').blur(function() {
                    if  ($(this).val().indexOf('Select') !== -1) {
                       $(this).css('color', '#6D6E71');
                    }
                });
            });
}, 500);

但由于我想在页面加载时使用值“--Select--”更改任何输入的颜色，我将代码更改为：

setTimeout(() => {
                $(document).ready(function () {                
                        if  ($('input').val().indexOf('Select') !== -1) {
                           $(this).css('color', '#6D6E71');
                        }          
                });
 }, 500);

此代码不起作用。为什么不？我应该如何更改它以便它可以工作？任何帮助将不胜感激。

Answer 1

您没有检查$('input')集合中的所有输入。 $('input').val()只返回集合中第一个输入的值。您可以使用each()来迭代整个集合：

setTimeout(() => {
    $(document).ready(function () {
       $('input').each(function() {
            if  ($(this).val().indexOf('Select') !== -1) {
               $(this).css('color', '#6D6E71');
            }
        });
    });
}, 500);