javascript - 根据 jQuery 中的文本框值 onload 更改 CSS 样式？

Question

我正在尝试使用 jQuery 1.9.1 使一些按钮的 CSS 更改加载取决于文本框值，但我无法做到这一点。假设在页面加载后，如果文本框的值为 YES，则按钮颜色应为绿色，如果另一个文本框的值为 NO，则按钮颜色应为蓝色的。在 HTML 中，只有“蓝色”类被指定为默认值，但 jQuery 必须更改该加载。这是我的代码:

$(document).ready(function () {
    $('.btn').load(function () {
        var isYes = $(this).next('.assignCheck').val('Y');
        if (isYes) {
            $(this).toggleClass('color-blue color-green');
        }
    });
});

JSFiddle Demo

如何根据页面加载后给定的值更改 CSS 样式？

Answer 1

更新

工作解决方案，

$('.btn').each(function () {
    if ($(this).next('.assignCheck').val() == 'y') {
        $(this).toggleClass('color-blue color-green');
    }
});

JSFiddle Demo

你的第一个问题是这一行:

var isYes = $(this).next('.assignCheck').val('Y');

它所做的不是测试它，而是将“y”分配给 .assignCheck 的值。你需要的是这样的:

var isYes = ($(this).next('.assignCheck').val() == 'y');

或者只是

if ($(this).next('.assignCheck').val() == 'y') {
    $(this).toggleClass('color-blue color-green');
}

更多信息@ http://api.jquery.com/val/ .

其次，.load() 已被弃用，请改用 each()，因为代码无论如何都会在文档加载时运行。

$('.btn').each(function() { ...