Javascript jquery在单选按钮和页面加载上更改css

我有下面的jquery代码段，它根据选择的单选按钮通过css显示或隐藏项目

<script>
    jQuery('input:radio[name="type"]').change(
        function(){
            if (jQuery(this).val() == 'value1') {
                jQuery('.one').css({'display':'none'});
                jQuery('.two').css({'display':'block'});
                jQuery('.three').css({'display':'none'});
            }
            else if (jQuery(this).val() == 'value2') {
                jQuery('.one').css({'display':'block'});
                jQuery('.two').css({'display':'none'});
                jQuery('.three').css({'display':'none'});
            }
            else if (jQuery(this).val() == 'value3') {
                jQuery('.one').css({'display':'none'});
                jQuery('.two').css({'display':'none'});
                jQuery('.three').css({'display':'none'});           
            }               
    });
</script>

jQuery（'input:radio[name=“type”]”）。更改(
函数（）{
if（jQuery（this）.val（）=='value1'）{
jQuery（'.one'）.css（{'display'：'none'}）；
jQuery（'.two'）.css（{'display'：'block'}）；
jQuery（'.three'）.css（{'display'：'none'}）；
}
else if（jQuery（this）.val（）=“value2”）{
jQuery（'.one'）.css（{'display'：'block'}）；
jQuery（'.two'）.css（{'display'：'none'}）；
jQuery（'.three'）.css（{'display'：'none'}）；
}
else if（jQuery（this）.val（）=“value3”）{
jQuery（'.one'）.css（{'display'：'none'}）；
jQuery（'.two'）.css（{'display'：'none'}）；
jQuery（'.three'）.css（{'display'：'none'}）；
}               
});

这是伟大的工作，但我现在想做的是让这发生在页面加载以及而不是仅仅当单选按钮被改变

---

实现这一点最简单的方法是什么？

您可以在附加事件侦听器后链接

.change（）

方法

这样做时，在附加事件侦听器之后会触发一个

change

事件（这可能会在加载页面时发生）

---

根据脚本在HTML文档中的位置，您可能需要确保它也包装在DOM就绪处理程序中

$(document).ready(function () {
    $('input:radio[name="type"]').change(function () {
        // ...
    }).change();
});

---

请您再解释一下链接

change（）

在这种情况下和一般情况下是如何工作的好吗？@callback这就是jQuery的工作原理。大多数方法返回jQuery对象。在本例中，链接

.change（）

方法与添加

$（'input:radio[name=“type”]”）基本相同在事件侦听器之后。这篇jQuery文章讨论了链接——为了让它起作用，我必须在选择器中添加
：checked
。所以：
$（'input:radio[name=“type”]：checked'）
$('input:radio[name="type"]').change(function () {
    // ...
}).trigger('change'); // <---

$(document).ready(function () {
    $('input:radio[name="type"]').change(function () {
        // ...
    }).change();
});