如何在JavaScript中为同一个div合并两个函数

下面的代码运行良好，但我希望选中合并并单击单个函数中的函数。可能吗

$(function () {
  if($("#enablepromo0").is(":checked"))   
     $("#PromoPanel").show(300);
  else
    $("#PromoPanel").hide(300);
});
$(function () {
   $("#enablepromo0").click(function () {
     if ($(this).is(":checked")) {
          $("#PromoPanel").show(300);
        } else {
          $("#PromoPanel").hide(300);
        }
    });
});

---

这两个函数执行相同的任务，因此我更改了一些内容以显示警报：

$（函数（）{
$（“#enablepromo0”）。单击（函数（）{
警报（“DDDD”）
如果（$（“#enablepromo0”）。为（“：选中”））
$（#PromoPanel”）。show（300）；
其他的
$（“#PromoPanel”）.hide（300）；
});
});

uuu
将代码移动到其自身的函数，并根据需要调用：

function showHide() {
  if ($("#enablepromo0").is(":checked"))   
     $("#PromoPanel").show(300);
  else
    $("#PromoPanel").hide(300);
}

$(function () { 
  showHide();

  $("#enablepromo0").click(function () {
    showHide();
  });
});

使用更改事件并触发它，然后它可以检测复选框的当前状态。我修改了代码来切换一个类，以避免一开始出现“flash”


$（函数（）{
$（“#enablepromo0”）。在（'change'，function（）上{
让isChecked=！this.checked；
$（“#PromoPanel”）。toggleClass（“隐藏”，已选中{
持续时间：300
});
}).触发（“变更”）；
});
.panel{
边框：固体石灰1px；
背景：#ddffdd；
}
.隐藏{
显示：无；
}

勾选以显示：
嗨，特蕾丝，加油
但我想为这两个功能做相同的工作。贫乏？？？不知道这是什么。@connexo清楚地将HTML“合并”到问题中以获得答案，否则我们会猜测这里不需要两个文档就绪函数。您也可以使用
$（“#enablepromo0”）。单击（showHide）但这不是一个坏的解决方案。是的，有很多变体。我一直保持相对简单，因为OP似乎不知道如何创建可重用函数。有足够多的问题可以问，比如
。单击（myfunc（））
vs
。单击（myfunc）
，在某些情况下，最好从基础开始构建，而不增加额外的潜在混乱。这在不添加隐藏类但丢失动画的情况下工作正常：(