jQuery 日期选择器弹出到字段日历答案

【问题标题】：jQuery Date Picker popup TO field CalendarjQuery 日期选择器弹出到字段日历
【发布时间】：2016-03-07 04:26:42
【问题描述】：

我正在使用插件在我的网站上使用bootstrap-datepicker 显示日期范围日历。

我对 jQuery 很陌生，很难弄清楚Methods 的用法。

当用户选择FROM 日期时，我想自动弹出TO 日期日历。目前我已打开autoclose，因此一旦选择了FROM 日期，日历就会消失，但无法弄清楚如何弹出TO 日历。

【问题讨论】：

你说的日历是 DateRange 选择器。
是的。我不知道 DateRange 选择器很受欢迎
从顶部选择“范围”类型..
对不起，请您再解释一下。

标签： jquery twitter-bootstrap-3

【解决方案1】：

我在这里向您发送我的 HTML。首先，我们需要为我们的 from date 输入和 to date 输入添加一些类。

为起始日期输入添加类fromdate 为日期输入添加类todate

<div id="sandbox-container">
            <div class="input-daterange input-group" id="datepicker">
                <input type="text" class="input-sm form-control fromdate" name="start" />
                <span class="input-group-addon">to</span>
                <input type="text" class="input-sm form-control todate" name="end" />
            </div>
        </div>

然后只需添加以下脚本，我希望它可以帮助您并为您提供所需的输出。

<script>
    $(document).ready(function(){
        $('#sandbox-container .input-daterange').datepicker({
            autoclose: true,
        });

        $(document).on('change', '.input-daterange > .fromdate', function (e) {
           $(".todate").focus();
        });
    });
</script>

这是我使用的 HTML 代码。只需相应地设置 CSS 和 js 的路径即可。

<!DOCTYPE html>
<html>
    <head>
        <script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
        <link id="bs-css" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
        <link id="bsdp-css" href="css/bootstrap-datepicker3.css" rel="stylesheet">
        <script src="js/bootstrap-datepicker.js"></script>
    </head>
    <body class="container">
        <div id="sandbox-container">
            <div class="input-daterange input-group" id="datepicker">
                <input type="text" class="input-sm form-control fromdate" name="start" />
                <span class="input-group-addon">to</span>
                <input type="text" class="input-sm form-control todate" name="end" />
            </div>
        </div>
    </body>
<script>
    $(document).ready(function(){
        $('#sandbox-container .input-daterange').datepicker({
            autoclose: true,
        });

        $(document).on('change', '.input-daterange > .fromdate', function (e) {
           $(".todate").focus();
        });
    });
</script>
</html>

【讨论】：

谢谢。` $(".todate").focus();` 在 .on("changeDate", function() { console.log('t'); $( "#ToDate").focus(); });

【解决方案2】：

我希望你只是在寻找这个

【讨论】：

嗨，普尼特。我已经有了。我只想知道一旦选择了 FROM 日期，如何弹出 TO 字段日历
好的，。我的理解是您想要喜欢，当任何用户选择“从”日期时，应关闭日期选择器，并自动打开“至”的日期选择器。我说的对吗？
是的。就是这样。我该怎么做？ :)
您的代码是否有效？或者你可以创建小提琴？
我正试图让这个小提琴工作，但它不起作用：jsfiddle.net/8gmhomjg/1