标签: webshim

尽管围绕html5形式的所有嗡嗡声,在我看来,在大多数情况下,通过这条路线,你正在创造额外的工作.

举一个例如,一个datepicker字段.本机html5实现在每个浏览器中呈现不同.此外,对于不支持此功能的浏览器,您的polyfilled解决方案(例如jquery UI)也将以不同方式呈现.

现在,当我们使用jquery完美地工作和统一解决方案时,我们已经为同一个表单引入了多个定制和维护点!

我很想听听这个领域的一些真实世界的经历,因为我对所有的嗡嗡声感到恼火!

我有一个字段需要从用户收集一年(即具有年分辨率的日期 - 为了便于存储,我更愿意存储实际日期值而不是数字).

我想使用现代浏览器或webshims支持的日期输入UI,因为它很好并且可以很好地适应现代平台.我无法弄清楚如何让UI只显示年份.有任何想法吗？

如果没有平台支持,理想情况下我希望有一个类似于你可以在这里看到的UI ,如果你点击"预览",然后点击窗口小部件的顶部几次,反过来:当你第一次点击输入时你得到一个包含几十年列表的小部件,然后你深入选择年份,然后关闭UI.

HTML5中的新表单属性和标签非常棒.不幸的是,在Chrome和Firefox中对这些只有有限的支持,在IE9及以下版本中基本上不支持这些.

我已经调查过使用Modernizr和HTML5 polyfill在缺乏本机支持的浏览器中填充此功能.但是,HTML5表单功能似乎有大量的polyfill,例如webshims lib,webforms2和h5f(例如参见https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser上的列表)-Polyfills)我不确定哪一个或哪些我应该花时间学习.

哪些HTML5形式的polyfill会给我最广泛的HTML5功能和浏览器覆盖范围？

我正在尝试在角度应用程序中使用webshims polyfill,它也使用requirejs进行依赖项管理.我试图form在表单字段中填充缺少属性,例如input和button,它告诉浏览器形成特定按钮或输入属于哪个.IE9缺乏此功能.

我认为使用此polyfill的最佳方法是创建一个form指令,并调用$.webshims.polyfill('forms')link函数内部.

define(['angular', 'webshims'], function(angular) {
  return angular.module('myApp').directive('form', ['$window', function($window) {
    return {
      restrict: 'E',
      scope: false,
      link: function($scope, iElement, iAttrs) {
        if (!(window.Modernizr.input.placeholder || window.Modernizr.input.autofocus)) {
          $.webshims.setOptions({
            waitReady: false
          });
          $.webshims.polyfill('forms');
        }
      }
    };
  }
]);

以下是我现在正在加载webshims polyfill的方法:

app: {
  options: {
    baseUrl: 'src/apps',
    stubModules: ['cs'],
    paths: {
      jquery: '../public/components/jquery/jquery',
      ....
      angular: '../public/components/angular/angular',
      ....
      webshims: '../public/components/webshim/src/polyfiller',
    },
    shim: {
      angular: {
        deps: ['jquery'],
        exports: 'angular'
      }, …

这是我使用的标记:

<input type="text" form="myform" name="inp1" />
<form id="myform" name="myform">
    ...        
</form>

现在我意识到它不适用于旧IE,因此我正在搜索HTML 5 polyfill.

任何人都知道某个覆盖HTML5功能的polyfill？