1

我不太喜欢 HTML,我在这个网页中有以下问题:http: //www.saranistri.com/saranistriWPnew/richiesta-online-di-foto-storiche/

如果您使用Chrome打开它,您会看到有 2 个日期字段,您可以在其中选择具有正确格式的数据(还显示向上和向下箭头以增加或减少数据)但是如果您打开此页面使用FireFox这些字段未正确显示(未显示 2 个箭头且未指定日期格式)。

使用FireBug我可以看到这些是由这个 HTML 部分实现的:

<p>
Periodo
<br>
da
    <span class="wpcf7-form-control-wrap date-from">
        <input class="wpcf7-form-control wpcf7-date wpcf7-validates-as-date" type="date" value="" name="date-from">
    </span>
a
    <span class="wpcf7-form-control-wrap date-to">
        <input class="wpcf7-form-control wpcf7-date wpcf7-validates-as-date" type="date" value="" name="date-to">
    </span>
</p>

如您所见,它指定了type="date"。为什么 Chrome 能正确显示而 Firefox 不能?我也有同样的问题使用资源管理器。

我该如何解决这个问题?

4

2 回答 2

4

Firefox(和 IE)目前还不支持input type="date"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Browser_compatibility

对于不支持原生 html5 输入日期的浏览器,您可以在闲暇时使用 datePicker 插件

于 2015-07-07T14:01:46.827 回答
2

我的项目也有同样的问题。您无需进行任何复杂的修改即可使其正常工作。

</body>只需将下面的代码复制并粘贴到您的标签正上方:

<script type="text/javascript">
      var datefield=document.createElement("input")
      datefield.setAttribute("type", "date")
      if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
         document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
        document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
        document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
      }
   </script>

 <script>
    if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
       jQuery(function($){ //on document.ready
           $('input[type=date]').datepicker({
                  dateFormat : 'yy-mm-dd'
                });
       })
    }
 </script>

<input type=date>这将允许您在不完全支持 HTML5 的浏览器中继续使用。

只要记住在所有输入字段中都有好的占位符,以便用户知道手动输入日期的格式,如果他选择的话。

还请注意这里的日期格式是“yy-mm-dd”,即它看起来像这样 1999-12-03。如果您想更改它,请将其设为“dd-mm-yy”,但对于数据库应用程序,我建议您保持原样。

于 2017-04-22T15:53:24.990 回答