我正在制作一个简单的预订表单,使用GET重定向到staah预订引擎(他们没有任何api或嵌入式小部件)。
预订引擎只接受" dd M yyyy"日期格式(例如2018年4月19日)
我有搜索SO但是没有找到任何可行的解决方案,最近我找到了工作小提琴,我编辑了那个小提琴我的需要(你会知道我想要在小提琴中实现什么)。你可以在这里看到它:https://jsfiddle.net/k5zookLt/1929/ 但问题是他们对HTML代码有不同的方法,我试图修改我的HTML的js代码,但它不起作用。我没有任何javascript技能。我不知道为什么这个小提琴在我的HTML代码中不起作用
我的代码
<div class="col-md-2 col-sm-3">
<div class="input-group date" >
<input type="text" class="jaraksmall sm-form-control form-control from " id="from" name="from" required>
</div>
</div>
<div class="col-md-2 col-sm-3">
<div class="input-group date">
<input type="text" class="jaraksmall sm-form-control form-control to" id="to" name="to" required>
</div>
小提示html代码:
<div class="line col-sm-4">
<div class="form-group">
<label>First check in:</label>
<input type="text" class="form-control form-control-1 input-sm"placeholder="CheckIn" >
</div>
<div class="form-group">
<label>First check out:</label>
<input type="text" class="form-control form-control-2 input-sm" placeholder="CheckOut">
</div>
</div><!--line-->
如何在我的html代码中使小提琴的js代码运行良好? 抱歉我的英文不好
答案 0 :(得分:0)
那是因为.each
的选择器和查找输入元素的选择器没有找到所需的元素。你需要:
1)删除每个语句。
2)修改datepicker输入元素选择器以使用已添加(往返)的类。
var startDate = new Date();
var fechaFin = new Date();
var FromEndDate = new Date();
var ToEndDate = new Date();
$(".from").datepicker({
autoclose: true,
startDate: "+0d",
format: 'd M yyyy'
}).on('changeDate', function(selected){
startDate = new Date(selected.date.valueOf());
startDate.setDate(startDate.getDate(new Date(selected.date.valueOf()))+1);
$('.to').datepicker('setStartDate', startDate);
});
$('.to').datepicker({
autoclose: true,
format: 'd M yyyy'
}).on('changeDate', function(selected){
FromEndDate = new Date(selected.date.valueOf());
FromEndDate.setDate(FromEndDate.getDate(new Date(selected.date.valueOf())));
$('.from').datepicker('setEndDate', FromEndDate);
});
<强> Working Demo 强>
答案 1 :(得分:0)
您也可以替换html代码,如下所示
<div class="line" style="width:100%">
<div class="col-md-2 col-sm-3" style="display: inline-block">
<div class="input-group date" >
<input type="text" class="jaraksmall sm-form-control form-control-1 form-control from " id="from" name="from" required>
</div>
</div>
<div class="col-md-2 col-sm-3" style="display: inline-block">
<div class="input-group date">
<input type="text" class="jaraksmall sm-form-control form-control-2 form-control to" id="to" name="to" required>
</div>
</div>
</div>