jquery - 用户输入值验证

Question

我试图在单击父按钮但无法正常工作时显示警告。如果输入的值是过去任何一天的值，则会显示警告。

这是HTML：

<div class="well">
  <button class="expando" />
  <fieldset class="hire_date_wrapper">
    <label>Hire Date</label>
    <input type="text" name="input_name" /><br />
    <span class="date_warning">Warning message</span>
  </fieldset>
</div>

这是js：

$('.expando').click(function(){
    var well = $(this).parents('.well');
    var hiredate = well.children('[name="input_name"]').val();
    var today = new Date();
    if (hiredate < today) {
        well.children('.date_warning').show();
    } else {
        well.children('.date_warning').hide();
    };
});

Answer 1

您应该将输入的日期转换为日期对象

$('.expando').click(function(){
    var well = $(this).parents('.well');
    var hiredate = new Date($( '[name="input_name"]', well).val());
    var today = new Date();
    if ( isNaN( hiredate.getTime() ) ) {
        $( '.date_warning', well ).show();
    } else {
        if (hiredate.getTime() < today.getTime()) {
            $( '.date_warning', well ).show();
        } else {
            $( '.date_warning', well ).hide();
        }
    }
});​

在这里试试：http: //jsfiddle.net/TM5EK/

Answer 2

我认为这是因为您只是在比较输入的值和一个日期对象，而不是 2 个日期对象。

尝试使用 将受雇者变成一个对象new Date(hiredate)。

小提琴：http: //jsfiddle.net/UjVRY/

小提琴中的代码

var now = new Date(),
    hiredate = '2012-10-10',
    hiredateobj = new Date(hiredate);

$('#results_noobj').html((hiredate < now ? 'before' : 'after')+' now');
// Output 'after now'

$('#results_obj').html((hiredateobj < now ? 'before' : 'after')+' now');
// OUtputs 'before now'

​</p>