jQuery检查复选框是否选中按钮点击，然后对PHP进行多次AJAX请求 - jQuery to check if checkbox is checked on button click, then do multiple AJAX requests to PHP

嗨，我想知道是否可以写一些jQuery来检查是否点击按钮，检查是否选中了某个复选框，并对PHP文件执行AJAX请求

如果成功，响应应该将JSON值发布到我的主html页面上的"results"和《results2》div中。

我已经尝试了下面的以下代码

<form action="PHP.php" id="test" method="post">
<input type="checkbox" name="check1" value="1"/>one<br />
<input type="checkbox" name="check2" value="2"/>two<br />
<input type="checkbox" name="check3" value="3"/>three<br />
<input type="submit" id="submit_button" name="sub" value="Show"/>
</form>
        <script>
        $('#submit_button').click(function(){   
        event.preventDefault();         
            if ($('.check1').is(':checked')) {
            $.ajax({
                url: 'PHP.php',
                type: 'POST',
                data: json,
                success: function(data){
                    $("#results").empty();
                    $("#results").append(data); 

                    console.log(data);
                }
            });
            }
            if ($('.check2').is(':checked')) {
            $.ajax({
                url: 'PHP2.php',
                type: 'POST',
                data: json,
                success: function(data){
                    $("#results2").empty();
                    $("#results2").append(data); 

                    console.log(data);
                }
            });
            }
        });
        </script>
</div>
<div id="results">
</div>
<div id="results2">
</div>

注意：我正在加载的PHP.PHP和PHP2.PHP文件目前只是在回显JSON，直到我能正常工作为止，但控制台根本没有记录任何数据。

我在让这个工作上遇到了一些麻烦。我希望得到一些帮助，或者关于最好的方法的指导

提前感谢

我想你看起来像这样：

表单：

   <form action="PHP.php" id="test" method="post">
        <input type="checkbox" name="check1" value="1" />one
        <br />
        <input type="checkbox" name="check2" value="2" />two
        <br />
        <input type="checkbox" name="check3" value="3" />three
        <br />
        <input type="submit" id="submit_button" name="sub" value="Show" />
      </form>

脚本：

  <script>
    (function($){
      $('#test').on('submit', function(e){
        e.preventDefault();
        var $checkbox = $(this).find('input[type=checkbox]');
        $checkbox.each(function(e){
          if($(this).is(':checked') ){
            var $name = $(this).attr("name");
            switch($name){
              case "check1": 
                // Do some AJAX operation
                break;
             case "check2": 
                // Do some AJAX operation
                break;
             case "check3": 
            // Do some AJAX operation
             break;
            }
          }
        });
        return false;
      });
    }(jQuery));
  </script>

如果HTML中有错误，请在每个复选框中添加类

<input type="checkbox" class="check1" name="check1" value="1"/>one<br />
<input type="checkbox" class="check2" name="check2" value="2"/>two<br />
<input type="checkbox" class="check3" name="check3" value="3"/>three<br />

在ajax部分，用单引号将json括起来：

dataType:'json'

试用

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<form action="PHP.php" id="test" method="post">
<input type="checkbox" id="check1" value="1"/>one<br />
<input type="checkbox" id="check2" value="2"/>two<br />
<input type="checkbox" id="check3" value="3"/>three<br />
<input type="button" id="submit_button" name="sub" value="Show"/>
</form>
        <script>
        $('#submit_button').click(function(){   
        //event.preventDefault(e);         
            if ($('#check1').is(':checked')) {
            $.ajax({
                url: 'PHP.php',
                type: 'POST',
                dataType: "json",
                success: function(data){
                    $("#results").empty();
                    $("#results").append(data); 

                    console.log(data);
                }
            });
            }
            else if ($('#check2').is(':checked')) {
            $.ajax({
                url: 'PHP2.php',
                type: 'POST',
                dataType: "json",
                success: function(data){
                    $("#results2").empty();
                    $("#results2").append(data); 

                    console.log(data);
                }
            });
            }
        });
        </script>
</div>
<div id="results">
</div>
<div id="results2">
</div>