Share examples of how to use the laydate calendar control

This article mainly introduces the use of laydate calendar control in detail. It has certain reference value. Interested friends can refer to it. I hope it can help everyone.

The example in this article shares how to use the laydate calendar control for your reference. The specific content is as follows

##

 var start = {
    elem: '#start_0',
    format: 'YYYY-MM-DD',
    max: laydate.now(-1),
    istime: false,
    istoday: false,
    choose: function (datas) {
      $("input[name='TimeStart']").parent().next(".timeError").addClass("hide");
      end.min = datas; //开始日选好后，重置结束日的最小日期 
      end.start = datas; //将结束日的初始值设定为开始日 
    }
  }
  var end = {
    elem: '#end_0',
    format: 'YYYY-MM-DD',
    min: '1900-01-01',
    istime: false,
    istoday: false,
    choose: function (datas) {
      start.max = datas; //结束日选好后，重置开始日的最大日期
    }
  };

  laydate(start);
  laydate(end);

Execute binding to the calendar when initializing the interface event.

How to

bind a calendar click event to a dynamically generated text box.

// 点击编辑按钮，给文本日期框添加.onclick事件
$("#expList").delegate(".edit","click",function () {
      var index = $("#expList .edit").index($(this));
      var len = index + parseInt(1);
      var start = {
        format: 'YYYY-MM-DD',
        max: laydate.now(-1),
        istime: false,
        istoday: false,
        choose: function (datas) {
          $("input[name='TimeStart']").parent().next(".timeError").addClass("hide");
          end.min = datas; 
          end.start = datas; 
        }
      };
      var end = {
        format: 'YYYY-MM-DD',
        min: '1900-01-01',
        istime: false,
        istoday: false,
        choose: function (datas) {
          start.max = datas; 
        }
      };

      document.getElementById("start_" + len).onclick = function () {
        start.elem = "#" + this.id;
        laydate(start);
      }
      document.getElementById("end_" + len).onclick = function () {
        end.elem = "#" + this.id;
        laydate(end);
      }
     

    });

Related recommendations:

Detailed sample code for HTML5 custom calendar control

Sharing examples of making calendar controls using native js

New algorithm for JavaScript blog-style calendar controls

The above is the detailed content of Share examples of how to use the laydate calendar control. For more information, please follow other related articles on the PHP Chinese website!