Question

我有两种形式。第一种形式包含用于年和月的两个文本字段，以及一个隐藏第一种形式并显示第二种形式的按钮。 sedond表单包含带有复选框的数据表。我想根据从第一个表单中选择的天数显示表格的行。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <div id="form1">
   <div class="form-group">
     <label>year:</label>
      <input type="text" id="year1" name="date" class="form-control">
    </div>
    <div class="form-group">
     <label>month:</label>
      <input type="text" id="month1" name="date" class="form-control">
    </div>

  <div class="form-group col-md-offset-5 ">
      <button class="btn btn-success " id="hide">valider</button>
  </div>
</div>
 <!--form 2-->
<div id="form2">
  <div class="form-group col-md-offset-5 ">
  <button class="btn btn-success add-all" type="submit" >Pointage men</button>
</div>
    <h4>YEAR : <span id="year"></span></h4>
    <h4>MONTH : <span id="month"></span></h4>
<table class="table table-bordered" id="mytable">
  <tr>
    <th><input type="checkbox" id="check_all"></th>
    <th>jour</th>
    <th>THS</th>
  </tr>
  </table>
</div>

jQuery

 $(document).ready(function() {
  $('#check_all').on('click', function(e) {
    if ($(this).is(':checked', true)) {
      $(".checkbox").prop('checked', true);
    } else {
      $(".checkbox").prop('checked', false);
    }
  });
  $('.checkbox').on('click', function() {
    if ($('.checkbox:checked').length == $('.checkbox').length) {
      $('#check_all').prop('checked', true);
    } else {
      $('#check_all').prop('checked', false);
    }
  });
  $("#form2").hide();
    var now = new Date();
    var day = ("0" + now.getDate()).slice(-2);
    var month = ("0" + (now.getMonth() + 1)).slice(-2);
    var year = now.getFullYear() ;

    $('#year1').val(year);
    $('#month1').val(month);
});
     $(document).ready(function(){
         $("#hide").click(function(){
            let year = $('#year1').val();
            let month = $('#month1').val();
            var selectedDay = selectedDate.getDate();

             $('#year').html(year);
             $('#month').html(month);

             $("#form1").hide();
            $("#form2").show();
            for(i = 1; i < selectedDay+1; i++){
             addTr(i);          
            }
          });
 });
 function addTr(day){
 let html = `<tr>
    <td><input name=chk_"`+day+`" type="checkbox" class="checkbox"></td>
    <td>`+day+`</td>
    <td><input name=t_"`+day+`" type="text"  class="form-control" value="2" /></td>
  </tr>`;

  $('#mytable').append(html);
 }

Answer 1

您能否提供一个示例，以哪种方式显示数据？

如果您选择2019年和第7个月然后显示的内容，则以第一种形式为例。

请详细解释，这将有所帮助。

如何使用jQuery JavaScript获取显示表中指定月份的天数？

1 个答案: