如何使用jQuery在页面加载时获取bootstrap-timepicker的时间

首先，你需要先完成timepicker组件的初始化，再在页面加载完成后调用对应的API方法来获取时间。这里提供两种常用的实现方式：

方式1：获取格式化后的时间字符串（与输入框显示格式一致） #

如果只需要和选择器输入框显示格式相同的时间字符串，直接使用jQuery的val()方法即可：

$(document).ready(function() {
    // 初始化timepicker，可根据需求添加配置项
    $('#starts-on').timepicker({
        defaultTime: 'current' // 可选配置：设置默认显示当前系统时间
    });

    // 获取页面加载时的时间字符串
    var currentTimeStr = $('#starts-on').val();
    console.log('当前时间：', currentTimeStr);
});

方式2：获取JavaScript Date对象（便于时间数值操作） #

如果需要对时间的具体数值（比如小时、分钟）进行操作，可以使用组件提供的getTime()方法获取Date对象：

$(document).ready(function() {
    $('#starts-on').timepicker({
        defaultTime: 'current'
    });

    // 获取Date类型的时间对象
    var currentTimeObj = $('#starts-on').timepicker('getTime');
    if (currentTimeObj) {
        var hours = currentTimeObj.getHours();
        var minutes = currentTimeObj.getMinutes();
        console.log('当前小时：', hours, '当前分钟：', minutes);
    }
});

注意点 #

• 务必确保获取时间的代码在timepicker初始化之后执行，所以建议把逻辑放在$(document).ready()或者其他页面加载完成的回调函数中。
• 如果没有设置defaultTime: 'current'，页面加载时选择器可能为空，这时候需要提前设置默认时间或者处理空值情况。

内容的提问来源于stack exchange，提问作者Vickey