时间戳

首页 > 解决方案 > 无按钮自动日期计算器

javascript - 无按钮自动日期计算器

问题描述

这是我的 HTML 代码： HTML 代码

<div class="input-field col  s12">
    <label for="PMDate">PM Date</label></br>
    <input type="Date" name="PMDate" id="date" value="<?php echo date('Y-m-d'); ?>" required>
</div>
<div class="input-field col s12">
    <label for="Period">PM Period</label></br>
    <select name="Period" id="period">
        <option value="Annually">Annually</option>
        <option value="Monthly">Monthly</option>
        <option value="Quarterly">Quarterly</option>
        <option value="HalfYear">Half-Year</option>
    </select>
</div>
<div class="input-field col s12">
    <label for="NPMDate">Next PM Date</label></br>
    <input type="date" name="NPMDate" id="npmdate" readonly>
</div>

这是我的脚本： JavaScript

<script type="text/javascript">
    $(document).ready(function () {
        onSelect:function (selectedPeriod) {
            if (this.id == 'period') {
                var period = document.getElementById("period").selectedIndex;
                var startDate = $('#date').datepicker("getDate");
                if (period == "Annually") {
                    var result = new Date(startDate.getFullYear() + 1, startDate.getMonth(), startDate.getDate());
                    document.getElementById("npmdate").innerHTML = result;
                }
            }
        }
    });
</script>

这是 UI 片段： UI

我希望下一个 PM 日期能够从 PM 日期和 PM 期间自动生成计算出的日期。用户选择日期和期间的位置。在按下“保存”按钮将所有输入记录插入数据库之前，计算会自动显示结果。到目前为止，计算无法显示出来。我需要帮助。

标签： javascriptphphtml

解决方案

试试这个：- 这只是每年计算

<input type="date" id="PMDate" name="date" value="<?php echo date('Y-m-d') ?>">
<select id="period" name="period">
    <option value="Annually">Annually</option>
    <option value="Monthly" selected>Monthly</option>
    <option value="Quarterly">Quarterly</option>
    <option value="Half-Year">Half-Year</option>
</select>
<input type="date" id="NPMDate" name="npmdate" readonly>
<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $('#period').change(function(){
                var period=this.value;
                var start_date=new Date($('#PMDate').val());
                console.log(start_date);

                if(period=='Annually'){
                    var result_date=new Date(start_date.getFullYear()+1+'-'+ start_date.getMonth()+'-'+start_date.getDate());
                    result_date=moment(result_date).format('Y-MM-DD');
                    $('#NPMDate').val(result_date);
                }
        })
    });
</script>>

推荐阅读