Javascript 无法将值从JQuery日期范围选择器传输到输入字段

Javascript 无法将值从JQuery日期范围选择器传输到输入字段,javascript,jquery,html,Javascript,Jquery,Html,我正在使用这个示例站点中的基本JQuery日期范围选择器:。我正在寻找一种方法,从日期范围选择器获取提供的输出,并在选择日期后将其放入两个输入字段中。现在,我只想证明我可以在新的输入字段中显示每个值。将来,我将解析字符串以提供两个单独的日期,但请暂时忽略这一点 <input id="dateRangePicker" type="text" name="daterange" value="01/01/2015 - 01/31/2015" /><br /> <input

我正在使用这个示例站点中的基本JQuery日期范围选择器:。我正在寻找一种方法,从日期范围选择器获取提供的输出,并在选择日期后将其放入两个输入字段中。现在,我只想证明我可以在新的输入字段中显示每个值。将来,我将解析字符串以提供两个单独的日期,但请暂时忽略这一点

<input id="dateRangePicker" type="text" name="daterange" value="01/01/2015 - 01/31/2015" /><br />
<input id="selectedDatePickerField" /><br />
<input id="selectedDatePickerField2" />


这就是我迄今为止所尝试的:

脚本:

    <script type="text/javascript">
        //<![CDATA[
        $(function () {
            $('input[name="daterange"]').daterangepicker();
            });
        });
        $(document).ready(function () {
            $('#dateRangePicker').on('change', function () {
                $('#selectedDatePickerField').val(this.value);
                $('#selectedDatePickerField2').val(this.value);
            }).change();
            $('#dateRangePicker').on('daterangepicker', function (e, ui) {
                $('#selectedDatePickerField').val(ui.item.value);
                $('#selectedDatePickerField2').val(ui.item.value);
            });
        });
        //]]>
    </script>

//

如何将值从日期范围选择器移动到每个输入字段?

该组件有两个属性来报告所选的
startDate
endDate
。您需要在生成更改事件后读取这些属性。要访问这些属性,请使用以下语法:

var drp=$('#daterange').data('daterangepicker').xxxxxx

其中xxxx是要调用的方法(可以是方法或属性)

日期范围选择器文档:

如果要在初始化后设置开始日期,可以使用:

//change the selected date range of that picker
$('#daterange').data('daterangepicker').setStartDate('03/01/2014');
$('#daterange').data('daterangepicker').setEndDate('03/31/2014');
最后是一把小提琴,它展示了一切是如何结合在一起的:


希望有帮助

该组件有两个属性来报告所选的
startDate
endDate
。您需要在生成更改事件后读取这些属性。要访问这些属性,请使用以下语法:

var drp=$('#daterange').data('daterangepicker').xxxxxx

其中xxxx是要调用的方法(可以是方法或属性)

日期范围选择器文档:

如果要在初始化后设置开始日期,可以使用:

//change the selected date range of that picker
$('#daterange').data('daterangepicker').setStartDate('03/01/2014');
$('#daterange').data('daterangepicker').setEndDate('03/31/2014');
最后是一把小提琴,它展示了一切是如何结合在一起的:


希望有帮助

您需要使用('apply.daterangepicker')上的来获取输入字段中的日期选择器startDate和endDate值

$('input[name="daterange"]').on('apply.daterangepicker', function(ev, picker) {
    $('#selectedDatePickerField').val(picker.startDate.format('DD/MM/YYYY'));         
    $('#selectedDatePickerField2').val(picker.endDate.format('DD/MM/YYYY'));
});
片段
//




您需要使用('apply.daterangepicker')上的来获取输入字段中的日期选择器startDate和endDate值

$('input[name="daterange"]').on('apply.daterangepicker', function(ev, picker) {
    $('#selectedDatePickerField').val(picker.startDate.format('DD/MM/YYYY'));         
    $('#selectedDatePickerField2').val(picker.endDate.format('DD/MM/YYYY'));
});
片段
//




使用
日期范围选择器
onselect函数执行此操作的最佳方法。请按照以下代码:

HTML

<input id="dateRangePicker" type="text" name="daterange" value="" /><br />
<input id="selectedDatePickerField" /><br />
<input id="selectedDatePickerField2" />

最好的方法是使用
daterangepicker
onselect函数。请按照以下代码:

HTML

<input id="dateRangePicker" type="text" name="daterange" value="" /><br />
<input id="selectedDatePickerField" /><br />
<input id="selectedDatePickerField2" />
为什么在代码中添加.change()?为什么在代码中添加.change()?