需要添加另一个onClick事件

Need to add another onClick event

本文关键字：onClick 事件 另一个 添加      更新时间：2023-09-26

我有一个复选框，它使用onclick处理程序进行样式设置。

我的问题是，我也想同时启动一个div。。以显示隐藏消息。

有点像：复选框（勾选进入特色）

如果勾选显示特色div，则隐藏。

我的代码是：

<span id="checkboxWrap" class="styledCheckboxWrap"><input name="include" type="checkbox" id="checkbox" onclick="setCheckboxDisplay(this)" class="styledCheckbox" /></span>

还想像…一样激发div：

onClick="toggle('feature');"

我可以将onClick事件链接到一个单击处理程序吗？

即。。

onclick="setCheckboxDisplay(this);toggle('feature');"

还是我在兜圈子。

使用事件侦听器。无论如何，它们都更好。：）

var check = document.getElementById('checkbox');
check.addEventListener('click', function () {
    setCheckboxDisplay(this);
});
check.addEventListener('click', function () {
    toggle('feature');
});

理想情况下，您应该尝试开始使用无结构的javascript，这基本上意味着您可以通过将javascript移动到<script>标记内或单独的文件中来将结构与函数分离。因此，您的代码将是这样的，并使其更易于阅读。

HTML

<span id="checkboxWrap" class="styledCheckboxWrap">
  <input name="include" type="checkbox" id="checkbox" class="styledCheckbox" />
</span>

编写脚本

<script>
$(function(){
  $('.styledCheckbox').click(function(){
    setCheckboxDisplay(this);
    toggle('feature');
  });
});
</script>

是的，您可以调用onclick属性中的多个语句，只要它们是分号分隔的。不过，这并不令人惊讶，所以我通常会定义一个新函数，将两者封装为一个调用。

只需将其委托给一个完成所有工作的函数。。。

// Somewhere in the head of the file...
function doOnClickStuff(target) {
    toggle('feature');
    setCheckboxDisplay(target);
}

然后让onClick处理程序调用。。。

onClick="doOnClickStuff(target);"
相关文章：