如果选择了值或两者的组合，如何选中和取消选中框？答案

【问题标题】：How to check and unchecked box if the value is selected or combination of either?如果选择了值或两者的组合，如何选中和取消选中框？
【发布时间】：2020-03-15 20:25:41
【问题描述】：

我有一个工作代码，可以检查每个复选框，并使用我的频道的 URL 参数在 thingspeak 中打开 window.open。我想检查两者的组合是否被选中，并且必须在 thingspeak 中对我的频道执行 URL 请求。这是当前执行该逻辑的代码。

 <div class = "custom-control custom-checkbox">
  <input type="checkbox" class ="custom-control-input" id="temperature">
    <label class = "custom-control-label" for="temperature">Temperature</label>
    </div>

 <div class = "custom-control custom-checkbox">
 <input type = "checkbox" class="custom-control-input" id="illuminance">
   <label class = "custom-control-label" for = "illuminance">Illuminance</label>
  </div>   
 <div class ="custom-control custom-checkbox">
 <input type ="checkbox" class="custom-control-input" id="button-state">
   <label class ="custom-control-label" for = "button-state">Button-State</label>


  // checking for per number of entries to read.
  $(function() {
    $("#download").click(function(e) {
      e.preventDefault();

      if($('#temperature').is(':checked')) {
        window.open('https://api.thingspeak.com/channels/899906/fields/1.csv');
      }
      if($('#illuminance').is(':checked')){
        window.open('https://api.thingspeak.com/channels/899906/fields/2.csv');
      }
      if($('#button-state').is(':checked')){
        window.open('https://api.thingspeak.com/channels/899906/fields/8.csv');
      }

    });

  });

  // check combination of either

  // downloading the date range from start to end.
  $(function() {
    $("#download").click(function(e){
      e.preventDefault();
      window.open('https://api.thingspeak.com/channels/899906/feeds.csv?start=2019-11-19%2019:11:19&end=2019-11-20%2019:11:20');

    });

  });

 //checking for multiple entries to read.  
  $(document).ready(function() {
    $('#download').click(function() {
    var hcount = 0;
    if($('#temperature').prop('checked')) hcount++;
    if($('#illuminance').prop('checked')) hcount++;
    if($('#button-state').prop('checked')) hcount++;
      if(hcount > 1) {
        window.location.href ='https://api.thingspeak.com/channels/899906/feeds.csv?results=100&median=10';
      }
    });
  });

【问题讨论】：

问题是什么？你能具体说明你想做什么吗？
无法理解问题。 #download 的点击事件是否有三种变体？选择任何一个：为此，您可以使用 if-elseif-else。我只能从你的问题中理解
我想知道，如果您选择 2，如何使其他复选框能够根据我的 URL 参数使用 window.open 下载正确的数据。它似乎使用最后一个功能将提要下载为具有多个的 CSV。想要满足 2 个或其中一个复选框能够根据给定的 URL 参数下载正确的数据。这意味着目前如果我选择 2 个复选框，则下载使用 3 个输入而不是 2 个。我还没有在我的检查条件下创建该条目。为什么我需要一些帮助，如果您注意到它为每个条目执行一个并将该文件下载为 CSV

标签： jquery rest api

【解决方案1】：

我检查了您的代码，发现您的 dom 中没有下载 ID，这就是它不起作用的原因。如果您将 #download 替换为 .custom-control-input，则此代码将正常工作。我正在与上述更新共享您的代码。

<!---Downloading File using 
Jquery with Buttons---->
  <div class="form-group"><br>
  <div class="col-md-1.9 text-center">
   <button id="download" name="download" class="btn btn-warning">Download</button><br>
    </div> 
  </div>

<div class = "custom-control custom-checkbox">
    <input type="checkbox" class ="custom-control-input" id="temperature">
    <label class = "custom-control-label" for="temperature">Temperature</label>
</div>

<div class = "custom-control custom-checkbox">
    <input type = "checkbox" class="custom-control-input" id="illuminance">
    <label class = "custom-control-label" for = "illuminance">Illuminance</label>
</div>   
<div class ="custom-control custom-checkbox">
    <input type ="checkbox" class="custom-control-input" id="button-state">
    <label class ="custom-control-label" for = "button-state">Button-State</label>
<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>

    <script>
        // checking for per number of entries to read.
        $(function () {

            $(".custom-control-input").click(function (e) {
                e.preventDefault();

                if ($('#temperature').is(':checked')) {
                    window.open('https://api.thingspeak.com/channels/899906/fields/1.csv');
                }
                if ($('#illuminance').is(':checked')) {
                    window.open('https://api.thingspeak.com/channels/899906/fields/2.csv');
                }
                if ($('#button-state').is(':checked')) {
                    window.open('https://api.thingspeak.com/channels/899906/fields/8.csv');
                }

            });

        });

        // check combination of either

        // downloading the date range from start to end.
        $(function () {
            $(".custom-control-input").click(function (e) {
                e.preventDefault();
                window.open('https://api.thingspeak.com/channels/899906/feeds.csv?start=2019-11-19%2019:11:19&end=2019-11-20%2019:11:20');

            });

        });

        //checking for multiple entries to read.  
        $(document).ready(function () {
            $('.custom-control-input').click(function () {
                var hcount = 0;
                if ($('#temperature').prop('checked'))
                    hcount++;
                if ($('#illuminance').prop('checked'))
                    hcount++;
                if ($('#button-state').prop('checked'))
                    hcount++;
                if (hcount > 1) {
                    window.location.href = 'https://api.thingspeak.com/channels/899906/feeds.csv?results=100&median=10';
                }
            });
        });

    </script>

试试这个。

【讨论】：