Fatal编程技术网

Jquery mobile Jquery移动日历

jquery-mobile

Jquery mobile Jquery移动日历,jquery-mobile,datepicker,Jquery Mobile,Datepicker,我在这里使用移动jQuery日历： 看起来很简单，但我无法使用onSelect函数捕获所选日期 我所拥有的是： <link rel="stylesheet" href="http://code.jquery.com/mobile/git/jquery.mobile-git.css" /> <link rel="stylesheet" href="/jquery-mobile-datepicker-wrapper-master/jquery.mobile.datepicker.

我在这里使用移动jQuery日历：

看起来很简单，但我无法使用onSelect函数捕获所选日期

我所拥有的是：

<link rel="stylesheet"  href="http://code.jquery.com/mobile/git/jquery.mobile-git.css" />
<link rel="stylesheet" href="/jquery-mobile-datepicker-wrapper-master/jquery.mobile.datepicker.css" />
<link rel="stylesheet" href="/jquery-mobile-datepicker-wrapper-master/jquery.mobile.datepicker.theme.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="/jquery-mobile-datepicker-wrapper-master/external/jquery-ui/datepicker.js"></script>
<script src="http://code.jquery.com/mobile/git/jquery.mobile-git.js"></script>
<script src="/jquery-mobile-datepicker-wrapper-master/jquery.mobile.datepicker.js"></script>
<script>

    $( document ).ready(function() {
        $('.date-input-inline').datepicker({
            onSelect: function(dateText, inst) {
                alert("Date is : " + dateText);
            }
        });
    });
</script>


$（文档）.ready（函数（）{
$（'.date input inline'）。日期选择器({
onSelect：函数（日期文本，inst）{
警报（“日期为：+dateText”）；
}
});
});
然后是HTML：

<body>
<input type="text" class="date-input-inline" data-inline="true" data-role="date">
正如您所期望的那样，这在我的网页上为我提供了一个输入字段和一个日历

问题是，当我点击一个日期时，我会得到没有显示所选日期的警报

如何从该日历中获取所选日期，以及在没有初始化的情况下如何工作

脚本src中的文件与从中获取的文件完全相同

它在这里表示-，在数据role=“date”时自动初始化。还应使用日期，而不是日期选择器。我已经试过了，但没什么区别。

我试过了您提供的代码，它可以按照您的要求工作

我甚至创造了

JSFIDLE创建过程 对于这2个css文件，我复制了css部分中的代码，前面有一条注释，注释中有文件名：

<link rel="stylesheet" href="/jquery-mobile-datepicker-wrapper-master/jquery.mobile.datepicker.css" />
<link rel="stylesheet" href="/jquery-mobile-datepicker-wrapper-master/jquery.mobile.datepicker.theme.css" />
我刚刚将代码复制到JavaScript部分

最后，我添加了您的代码：

$( document ).ready(function() {
        $('.date-input-inline').datepicker({
            onSelect: function(dateText, inst) {
                alert("Date is : " + dateText);
            }
        });
    });
结论 弹出窗口显示良好，您将看到，如果您测试。请注意，一旦您实际选择了日期，就会出现弹出窗口

你的问题在别处，而不是代码。您的安全设置或浏览器。如果您有未发布的其他代码，则可能会干扰运行。确保将自己的示例剥离干净，如fid中所述。检查控制台是否存在错误，甚至可能验证是否在移动环境中运行此功能，例如Phonegap或Cordova？如果是，请尝试在普通浏览器中运行，并删除Cordova或Phonegap插件，看看是否可以通过这种方式进行调试

最有可能的问题是，其他Javascript中的某些错误阻止了所需的选项

如果您没有执行上述操作，或者这不是问题所在，请删除“onSelect”位并尝试更改

$( document ).ready(function() {
        $('.date-input-inline').datepicker({
            /* Insert any configuration parameters here, such as changeYear: true, */
        });

    $('.date-input-inline').change(function() {
        var datevalue = $(this).val() ;
        alert (datevalue);
    });
});
您可以使用ChangejQuery事件来检测字段何时发生了更改，就像brianlmerritt所说的那样

$( document ).ready(function() {
        $('.date-input-inline').datepicker({
            /* Insert any configuration parameters here, such as changeYear: true, */
        });

    $('.date-input-inline').change(function() {
        var datevalue = $(this).val() ;
        alert (datevalue);
    }); 
});
但是，我认为对于移动设备来说，最好的方法是使用本地数据采集器

是否可以使用字段type=“date”进行测试？ e、 g:
尝试在真正的移动设备上进行测试

我真的很感谢您花了这么多时间来做。我不确定它是否与我的设置100%相同。我没有任何额外的JS，但它不适合我。我会把所有东西都剥掉，再试一次。 
$( document ).ready(function() {
        $('.date-input-inline').datepicker({
            /* Insert any configuration parameters here, such as changeYear: true, */
        });

    $('.date-input-inline').change(function() {
        var datevalue = $(this).val() ;
        alert (datevalue);
    }); 
});

<input type="date" class="date-input-inline" data-inline="true" data-role="date">