Question

我真的不知道该怎么做。我有两个按钮，彼此相邻，如下：

<div class="half">
    <label class="half">
        End Date:
        <div class="btn_contain">
            <input type="button" id="btnWeek" value="-1 Week" /><!-- THIS ONE... -->
            <input type="button" id="btnMonth" value="-1 Month" /><!-- ...AND THIS ONE -->
        </div>
        <input type="date" id="txtEndDate" name="end" value="<?php echo date('Y-m-d', strtotime('-1 day')); ?>" />
    </label>
    <label class="half">
        Start Date:
        <div class="btn_contain">
            <input type="button" id="btnToday" value="Today" />
        </div>
        <input type="date" id="txtStartDate" name="start" value="<?php echo date('Y-m-d'); ?>" />
    </label>
</div>

以下是元素的CSS：

.half {display:block;}
.half:nth-child(even) {float:right; margin-right:0;}
.half:nth-child(odd) {float:left;}
.btn_contain {float:right;}
input[type="date"] {width:100%; display:block;}

现在为javascript：

formatEndDate = function(date){
    var day = ('0' + date.getDate()).slice(-2);
    var month = ('0' + (date.getMonth() + 1)).slice(-2);
    var year = date.getFullYear();
    $('#txtEndDate').val(year + '-' + month + '-' + day);
}

$('#btnWeek').click(function(){
    var lastWeek = new Date();
    lastWeek.setDate(lastWeek.getDate() - 7);
    formatEndDate(lastWeek);
});

$('#btnMonth').click(function(){
    var lastMonth = new Date();
    lastMonth.setMonth(lastMonth.getMonth() - 1);
    formatEndDate(lastMonth);
});

现在，问题在于：

无论出于何种原因，“ - 1月”按钮会被渲染到“-1周”按钮的左侧......从逻辑上讲，它应该是相反的吗？
单击“-1 Week”按钮可以执行它应该执行的操作，但是如果单击“-1 Month”按钮，则会先触发月份按钮的单击方法，然后立即执行“-1 Week”按钮的方法（我使用console.log（）验证了这一点。）点击它后，它似乎只从“开始日期”字段的值中扣除一周。

导致此行为的原因是什么，我该如何解决？

Answer 1

将您的label元素更改为span或其他内容。 label具有与input相关的特殊功能，这会导致您的问题。

单击一个按钮会触发两个按钮的Jquery方法

1 个答案: