如何在一个onclick函数中添加两个响应?html中的onclick是

How to add two responses to one onclick function? The onclick in html is

本文关键字：onclick 响应 两个 中的 html 函数 一个 添加      更新时间：2023-09-26

我正试图弄清楚，如果使用其他点击，如何获得一个点击函数来做一些新的事情。我有三个onclick函数，每个函数在单击时都有单独的反馈语句。他们连接的div看起来像这样：

$('#p26_opt1, #p26_opt2, #p26_opt3').click(function() {
  // check whether this div was selected already
  var wasSelected = $(this).data('selected');
  document.getElementById("p26_feedback1").style.display = 'block';
  document.getElementById("p26_feedback2").style.display = 'none';
  // change its selected state to the opposite of what it was before
  $(this).data('selected', !wasSelected);
  // keep track of whether any checkboxes are un-checked with a flag
  var anyUnselected;
  // iterate through all the divs
  $('#p26_opt1, #p26_opt2, #p26_opt3').each(function() {
    // if there was already an un-selected div, or if this div is
    // un-selected, set our flag
    anyUnselected = anyUnselected || !$(this).data('selected');
  });
  // if our flag indicates any were un-seelcted, stop here
  if (anySelected) return;
  // do whatever you want to do when all three are checked.
  $('#p26_feedback3').show();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="p26_options">
  <div id="p26_opt1">Periodically review the data stored on your devices to determine what you no longer need</div>
  <br>
  <div id="p26_opt2">Delete the data and empty the recycle bin</div>
  <br>
  <div id="p26_opt3">Follow the Defense Department guidelines to get rid of all traces of the data on your computer</div>
  <br>
  <div id="p26_opt4">Put it on your to do list for next week</div>
  <br>
</div>
<div id="p26_feedback1">And what else should you do? There are more correct answers.</div>
<div id="p26_feedback2">Not quite &ndash; why not do it now instead? Please try again.</div>
<div id="p26_feedback3">Yes! To completely dispose of electronic data, you need to review and identify old data, delete it and empty your recycle bin and take further measures to get rid of all traces of it on your device.</div>

我可以选择每个选项并得到单独的回复。我的问题是，只有同时选择了这三个选项，我才能显示第二个反馈声明？

在Javascript中，每当你想做任何事情来响应发生的事情时，你必须将你的逻辑与对应于"正在发生的事情"的相关事件的处理程序联系起来。在这种情况下，场景的相关部分是，当用户单击一个时，您希望检查选择了哪些元素。在确定"点击"是您想要针对的事件之后，您的下一步是添加一个onClick处理程序。

具体来说，您想要做的是向所有三个元素添加一个onClick处理程序，该处理程序检查是否检查了其他两个元素（如果是，则创建所需的反馈）。例如，假设你有三个复选框，都有一个类"复选框"：

$('.checkbox').click(function() {
     // keep track of whether any checkboxes are un-checked with a flag
     var anyUnchecked;
     // iterate through all the checkboxes
     $('.checkbox').each(function() {
         // if there was already an un-checked checkbox, or if this checkbox is
         // un-checked, set our flag
         anyUnchecked = anyUnchecked || !$(this).is(':checked');
     });
     // if our flag indicates any were un-checked, stop here
     if (anyUnchecked) return;
     // do whatever you want to do when all three are checked.
     $('#secondaryFeedbackStatement').show();
});

-编辑-

由于您不处理复选框（它们跟踪自己的状态），因此需要跟踪是否以某种方式选择了每个<div>。幸运的是，jQuery提供了一种在元素上保存任意数据的机制，称为data。以下是如何使用它：

$('#p26_opt1, #p26_opt2, #p26_opt3').click(function() {
     // check whether this div was selected already
     var wasSelected = $(this).data('selected');
     // change its selected state to the opposite of what it was before
     $(this).data('selected', !wasSelected);
     // keep track of whether any checkboxes are un-checked with a flag
     var anyUnselected;
 // iterate through all the divs
     $('#p26_opt1, #p26_opt2, #p26_opt3').each(function() {
         // if there was already an un-selected div, or if this div is
         // un-selected, set our flag
         anyUnselected = anyUnselected || !$(this).data('selected');
     });
     // if our flag indicates any were un-seelcted, stop here
     if (anySelected) return;
     // do whatever you want to do when all three are checked.
     $('#secondaryFeedbackStatement').show();
});

    var a = false
    var b = false
    var c = false
onclickA(){
     //general onclickA code
     a = true
     if (a && b && c){
        //execute your desired code  
     }
}
onclickB(){
     //general onclickBcode
     b = true
     if (a && b && c){
        //execute your desired code  
     }
}
onclickC(){
     //general onclickC code
     c = true
     if (a && b && c){
        //execute your desired code  
     }
}

如果这就是你想要的。

相关文章：