日期时间选择器未在Adobe AIR中运行

我使用html，jquery和adobe air构建应用程序。在我的应用程序的一部分中，我使用jQuery提供的日期时间选择器。如果我使用浏览器测试它们，它运行良好。但是，当我与Adobe AIR相结合，并使用AIR编译它，它没有工作....日期时间选择器未在Adobe AIR中运行

这里是我的代码：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Datepicker - Icon trigger</title> 
    <link rel="stylesheet" href="base/jquery.ui.all.css"> 
    <script type="text/javascript" src="js/jquery-1.4.4.js"></script> 
    <script type="text/javascript" src="js/jquery.ui.core.js"></script> 
    <script type="text/javascript" src="js/jquery.ui.widget.js"></script> 
    <script type="text/javascript" src="js/jquery.ui.datepicker.js"></script> 
    <script type="text/javascript" src="js/AIRAliases.js"></script> 
    <link rel="stylesheet" href="css/demos.css"> 

    <script language="JavaScript"> 
     $(document).ready(function(){ 
      $("#datepicker").datepicker({ 
       showOn: "button", 
       buttonImage: "images/calendar.gif", 
       buttonImageOnly: true 
      }); 
     }); 
    </script> 
</head> 
<body> 

<div class="demo"> 

<p>Date: <input type="text" id="datepicker"></p> 

</div><!-- End demo --> 



<div class="demo-description"> 
<p>Click the icon next to the input field to show the datepicker. Set the datepicker to open on focus (default behavior), on icon click, or both.</p> 
</div><!-- End demo-description --> 

</body> 
</html>

有谁能够解决这个问题？谢谢

来源

2011-02-16 Sthepen

你错过了`在脚本上键入`-`属性。其次，你有没有尝试隔离错误？ `$（）。ready（）`是否工作，干净的日期选择工作，其他插件的工作？ – jerone 2011-02-16 07:41:50

正如在这个post在jQuery UI开发小组中所述，它的当前形式的jQuery datepicker在Adobe Air中不起作用。这报告在Bug #3945。原因是Datepickers使用为创建的Datepicker界面动态创建的onclick事件，Adobe Air内不允许执行此类操作以及eval()和setTimeout()。在作品中有一个修订版本，有些人已经分支了主要代码来尝试修复，这些都记录在上面的链接中。

来源

2011-04-15 14:01:57 AppSol

正如AppSol所指出的那样，这是jQuery UI和AIR的沙盒问题。但是，制作解决方案非常简单。只需下载jQuery UI的未缩小版本，并在_updateDatepicker（）函数的末尾添加以下内容。在上线16年1月8日的版本8954

$(".ui-datepicker-prev").click(function() { 
      $.datepicker._curInst.drawMonth--; 
      if ($.datepicker._curInst.drawMonth < 0) { 
       $.datepicker._curInst.drawMonth = 11; 
       $.datepicker._curInst.drawYear--; 
      } 
      $.datepicker._updateDatepicker($.datepicker._curInst); 
     }); 

     $(".ui-datepicker-next").click(function() { 
      $.datepicker._curInst.drawMonth++; 
      if ($.datepicker._curInst.drawMonth > 11) { 
       $.datepicker._curInst.drawMonth = 0; 
       $.datepicker._curInst.drawYear++; 
      } 
      $.datepicker._updateDatepicker($.datepicker._curInst); 
     }); 

     $(".ui-datepicker-calendar").find("tr > td").each(function() { 
      $(this).click(function() { 
       var t = $(this).attr('onclick').split('.')[2].split('(')[1].split(')')[0].split(','); 
       $.datepicker._selectDay(t[0].substr(1,t[0].length-2),t[1],t[2],this); 
      }); 
     });

下面是它应该如何看起来像在最后：

/* Generate the date picker content. */ 
_updateDatepicker: function(inst) { 
    var self = this; 
    self.maxRows = 4; //Reset the max number of rows being displayed (see #7043) 
    var borders = $.datepicker._getBorders(inst.dpDiv); 
    instActive = inst; // for delegate hover events 
    inst.dpDiv.empty().append(this._generateHTML(inst)); 
    var cover = inst.dpDiv.find('iframe.ui-datepicker-cover'); // IE6- only 
    if(!!cover.length){ //avoid call to outerXXXX() when not in IE6 
     cover.css({left: -borders[0], top: -borders[1], width: inst.dpDiv.outerWidth(), height: inst.dpDiv.outerHeight()}) 
    } 
    inst.dpDiv.find('.' + this._dayOverClass + ' a').mouseover(); 
    var numMonths = this._getNumberOfMonths(inst); 
    var cols = numMonths[1]; 
    var width = 17; 
    inst.dpDiv.removeClass('ui-datepicker-multi-2 ui-datepicker-multi-3 ui-datepicker-multi-4').width(''); 
    if (cols > 1) 
     inst.dpDiv.addClass('ui-datepicker-multi-' + cols).css('width', (width * cols) + 'em'); 
    inst.dpDiv[(numMonths[0] != 1 || numMonths[1] != 1 ? 'add' : 'remove') + 
     'Class']('ui-datepicker-multi'); 
    inst.dpDiv[(this._get(inst, 'isRTL') ? 'add' : 'remove') + 
     'Class']('ui-datepicker-rtl'); 
    if (inst == $.datepicker._curInst && $.datepicker._datepickerShowing && inst.input && 
      // #6694 - don't focus the input if it's already focused 
      // this breaks the change event in IE 
      inst.input.is(':visible') && !inst.input.is(':disabled') && inst.input[0] != document.activeElement) 
     inst.input.focus(); 
    // deffered render of the years select (to avoid flashes on Firefox) 
    if(inst.yearshtml){ 
     var origyearshtml = inst.yearshtml; 
     setTimeout(function(){ 
      //assure that inst.yearshtml didn't change. 
      if(origyearshtml === inst.yearshtml && inst.yearshtml){ 
       inst.dpDiv.find('select.ui-datepicker-year:first').replaceWith(inst.yearshtml); 
      } 
      origyearshtml = inst.yearshtml = null; 
     }, 0); 
    } 
    $(".ui-datepicker-prev").click(function() { 
     $.datepicker._curInst.drawMonth--; 
     if ($.datepicker._curInst.drawMonth < 0) { 
      $.datepicker._curInst.drawMonth = 11; 
      $.datepicker._curInst.drawYear--; 
     } 
     $.datepicker._updateDatepicker($.datepicker._curInst); 
    }); 

    $(".ui-datepicker-next").click(function() { 
     $.datepicker._curInst.drawMonth++; 
     if ($.datepicker._curInst.drawMonth > 11) { 
      $.datepicker._curInst.drawMonth = 0; 
      $.datepicker._curInst.drawYear++; 
     } 
     $.datepicker._updateDatepicker($.datepicker._curInst); 
    }); 

    $(".ui-datepicker-calendar").find("tr > td").each(function() { 
     $(this).click(function() { 
      var t = $(this).attr('onclick').split('.')[2].split('(')[1].split(')')[0].split(','); 
      $.datepicker._selectDay(t[0].substr(1,t[0].length-2),t[1],t[2],this); 
     }); 
    }); 

},

这只是测试了jQuery UI的不过16年8月1日的想法在这个固定未来版本仍然保持不变。您需要将点击事件处理程序添加到next和prev按钮以及实际日期。

来源

2011-10-17 11:05:19 Ivan

下面是日期选择器的Adobe AIR上的一个功能版本：

https://github.com/metaweta/jquery-ui/blob/df77b43f08c593ed5a21323c02cc51b8ada37b02/ui/jquery.ui.datepicker.js

只要使用该文件和jquery.ui.core.js

来源

2012-07-23 17:49:17 cbacelar

日期时间选择器未在Adobe AIR中运行

回答

相关问题