zoukankan      html  css  js  c++  java
  • MUI中的picker插件怎么设置初始值

    开始时间确定后,选择结束时间需要在开始时间之前。customData的默认值暂时没有修改,修改的有bug

    customData修改:

    var hour = date.getHours();
    var Minute = date.getMinutes();
    var completeHours = new Array([
    {"text":"10:00","value":"10:00"}, {"text":"10:30","value":"10:30"},
    {"text":"11:00","value":"11:00"}, {"text":"11:30","value":"11:30"},
    {"text":"12:00","value":"12:00"}, {"text":"12:30","value":"12:30"},
    {"text":"13:00","value":"13:00"}, {"text":"13:30","value":"13:30"},
    {"text":"14:00","value":"14:00"}, {"text":"14:30","value":"14:30"},
    {"text":"15:00","value":"15:00"}, {"text":"15:30","value":"15:30"},
    {"text":"16:00","value":"16:00"}, {"text":"16:30","value":"16:30"},
    {"text":"17:00","value":"17:00"}]);
    if(Minute==0){
    var completeHoursArr = completeHours[0].slice(2*(hour-10),15);
    }else{ var completeHoursArr = completeHours[0].slice(2*(hour-10)+1,15); }
    options.customData = {"h":completeHoursArr};

    以上有BUG.

    html:

    <div class="mui-input-group" style="">
      <div class="mui-input-row">
        <label>用车时间</label>
         <input type="text" id="orderDateFrom" class="input-rent-datetime mui-text-right" readonly="readonly" placeholder="请选择" data-        options='{"type":"hour","beginYear":2017,"customData":{"h":[
    {"text":"10:00","value":"10:00"}, {"text":"10:30","value":"10:30"},
    {"text":"11:00","value":"11:00"}, {"text":"11:30","value":"11:30"},
    {"text":"12:00","value":"12:00"}, {"text":"12:30","value":"12:30"},
    {"text":"13:00","value":"13:00"}, {"text":"13:30","value":"13:30"},
    {"text":"14:00","value":"14:00"}, {"text":"14:30","value":"14:30"},
    {"text":"15:00","value":"15:00"}, {"text":"15:30","value":"15:30"},
    {"text":"16:00","value":"16:00"}, {"text":"16:30","value":"16:30"},
    {"text":"17:00","value":"17:00"}]},"labels":["年", "月", "日", "时段", "分"]}'>
    </div>
      <div class="mui-input-row">
        <label>还车时间</label>
        <input type="text" id="orderDateTo" class="input-rent-datetime mui-text-right" readonly="readonly" placeholder="请选择"
    data-options='{"type":"hour","beginYear":2017,"customData":{"h":[
    {"text":"10:00","value":"10:00"}, {"text":"10:30","value":"10:30"},
    {"text":"11:00","value":"11:00"}, {"text":"11:30","value":"11:30"},
    {"text":"12:00","value":"12:00"}, {"text":"12:30","value":"12:30"},
    {"text":"13:00","value":"13:00"}, {"text":"13:30","value":"13:30"},
    {"text":"14:00","value":"14:00"}, {"text":"14:30","value":"14:30"},
    {"text":"15:00","value":"15:00"}, {"text":"15:30","value":"15:30"},
    {"text":"16:00","value":"16:00"}, {"text":"16:30","value":"16:30"},
    {"text":"17:00","value":"17:00"}]},"labels":["年", "月", "日", "时段", "分"]}'>
      </div>
    </div>

    js:

    $('.input-rent-datetime').each(function(i, obj) {
      obj.addEventListener('tap', function() {
        var optionsJson = this.getAttribute('data-options') || '{}';
        var options = JSON.parse(optionsJson);
        var picker = new $.DtPicker(options);
        if(obj.getAttribute("id")=="orderDateTo"){
          var date= new Date(beginTime);;
          options.beginYear=date.getFullYear();
          options.beginMonth=date.getMonth()+1;
          options.beginDay=date.getDate();
          options.beginCustomData=date.getHours();
        }
        picker.show(function(rs) {
        obj.value = rs.text;
        picker.dispose();
        beginTime = rs.text;
        });
      }, false);
    });

     方法2

    var date= new Date(beginTime);
    Year = date.getFullYear();
    Month = date.getMonth()+1;
    Day = date.getDate();
    if(Month<10){
    Month = "0"+Month;
    }if(Day<10){
    Day = "0"+Day;
    }
    time=Year+"-"+Month+"-"+Day;
    picker.setSelectedValue(time);

  • 相关阅读:
    PyTorch学习笔记7--案例3:基于CNN的CIFAR10数据集的图像分类
    [转载]使用 Pandoc 与 Markdown 生成 PDF 文件
    [转载]论文笔记:目标检测算法(R-CNN,Fast R-CNN,Faster R-CNN,FPN,YOLOv1-v3)
    [转载]论文笔记:CNN经典结构2(WideResNet,FractalNet,DenseNet,ResNeXt,DPN,SENet)
    [转载]论文笔记:CNN经典结构1(AlexNet,ZFNet,OverFeat,VGG,GoogleNet,ResNet)
    [转载]ImageNet历年冠军和相关CNN模型
    神经网络模型Tricks归纳
    Python生成windows可执行的exe文件
    如何让chrome浏览器自动打开Adobe Flash Player?
    PyTorch学习笔记6--案例2:PyTorch神经网络(MNIST CNN)
  • 原文地址:https://www.cnblogs.com/Adyblog/p/7126541.html
Copyright © 2011-2022 走看看