【问题标题】:Delete Date using backspace or delete使用退格键删除日期或删除
【发布时间】:2017-03-30 06:32:19
【问题描述】:

我使用 jQuery datepicker 为多个输入字段创建了多个日期选择。

现在的问题是我想删除任何日期表单光标位置

到 Jquery ui 的外部链接

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">

多个日期选择输入字段

<input type="text" class="dates_opted dates_opted_1">
<br><br>
<input type="text" class="dates_opted dates_opted_2">    

jQuery和jQuery ui Js文件cdn链接

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 

js代码

    <script>
    function cleanArray(actual) {
      var newArray = new Array();
      for (var i = 0; i < actual.length; i++) {
        if (actual[i]) {
          newArray.push(actual[i]);
        }
      }
      return newArray;
    }
    jQuery(document).ready(function($) {
      $('.dates_opted').each(function(index){
          var dates=[];
       $(this).datepicker({
      dateFormat: "yy-mm-dd",
      onSelect: function(){
       dates=cleanArray(dates);
        dates.push($(this).val());
        //console.log(dates);
        $(this).val(dates);


      },showAnim :'slide',
    minDate: 0

    }).keyup(function(e) {
        if(e.keyCode == 8 || e.keyCode == 46) {
          var datesString=$(this).val().split(",");
           dates=[];
          for(var i=0 ; i<datesString.length-1;i++){

            dates.push(datesString[i]);
          }
          $(this).focus();
          $(this).blur();
          $(this).val(dates);


        }
    });
         });
    });
</script>

Here is jsfiddle

【问题讨论】:

    标签: javascript jquery ajax jquery-ui datepicker


    【解决方案1】:
    function(e)
    {
       if(e.keyCode == 8 || e.keyCode == 46)
          {
             var datesString=$(this).val().split(",");
             dates=[];
    

    获取光标位置并找到需要删除的日期索引

          cix=$(this).selectionStart;
          ix=Math.floor(cix/9);
    

    运行所有数组并跳过新数组中的值

          for(var i=0 ; i<datesString.length;i++)
             {
                 if(i!=ix)
                   {
                      dates.push(datesString[i]);
                   }
             }
          $(this).focus();
          $(this).blur();
          $(this).val(dates);
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-06-20
      • 1970-01-01
      • 2020-12-17
      相关资源
      最近更新 更多