Question

我在html页面输入了type="date"，我想通过JavaScript禁用特定日期。我怎么能这样做？

我尝试禁用getElementById但禁用完整日期输入。

Answer 1

您可以在输入类型=日期中添加最小或最大属性。日期必须是ISO格式（yyyy-mm-dd）。许多移动浏览器和当前版本的Chrome都支持此功能，但用户可以在不使用日期选择器的情况下手动输入无效日期。

<input name="somedate" type="date" min="2017-11-25">

min和max属性必须是完整日期;没有办法指定“今天”或“+0”。为此，您需要使用JavaScript或服务器端语言：

    var today = new Date().toISOString().split('T')[0];
document.getElementsByName("somedate")[0].setAttribute('min', today);

然而，我们还不能做的是从我们的输入中消除几天的时间。例如，我们不能仅仅通过标记来阻止选择周末或禁止周一。相反，我们需要使用HTML5验证API和本机JavaScript Date对象做更多的工作。

如果所选日期是星期一，则会显示错误的代码。

    var date = document.querySelector('[type=date]');

function noMondays(e){

    var day = new Date( e.target.value ).getUTCDay();

    // Days in JS range from 0-6 where 0 is Sunday and 6 is Saturday

    if( day == 1 ){

        e.target.setCustomValidity('OH NOES! We hate Mondays! Please pick any day but Monday.');

    } else {

        e.target.setCustomValidity('');

    }

}

date.addEventListener('input',noMondays);

Answer 2

您可以在日期属性上设置最大值/最小值，如下所示：https://www.w3schools.com/tags/att_input_min.asp

然而，这不允许您禁用特定日期。如果你真的想要这个，我会检查在发布表格时是否允许选择日期。

您可以在JQuery中的提交中获取所选日期值：

 $('#submit').on('click', function(){
      var date = new Date($('#date-input').val());

      day = date.getDate();
      month = date.getMonth() + 1;
      year = date.getFullYear();

      //Check here if date, month and year combination is allowed
 });

在这个例子中，我们有一个id为'date-input'的日期元素和一个id为'submit'的按钮。

请注意，您还应该检查服务器端是否允许日期。

如何从JavaScript禁用输入类型=“日期”的特定日期

2 个答案: