Question

我昨天在我的注册表单中添加了一个日期时间选择器，并在Firefox中测试它，因为我可以轻松地使用Firebug，并且它运行良好。今天当我在Chrome（我的常用浏览器）中尝试它时，我发现我的数据库中没有使用任何帐户（虽然它仍可在Firefox中使用）。我认为这是由于从日期时间选择器中检索值的方式。在FireFox中，只允许您在00/00/2016输入的格式似乎不起作用，因此它只是一个字符串框，但在Chrome中格式化工作正常。我假设我的Javascript检索值很好，因为在Firefox中它是一个标准输入框，但在Chrome中，因为它是一个日期时间选择器框，我使用错误的代码来检索值。

我的问题是，如何在两个浏览器中同时使用它？或者更好的我如何在Firefox中修复日期时间选择器？提前谢谢。

http://thomas-smyth.co.uk/register.php

                <div class="form-group">
                    <label>Date of Birth</label>
                    <input class="form-control" type="date" id="dteDoB"/>
                </div>

JS

function Register(){
    var Forename = $("#txtForename" ).val();
    var Surname = $("#txtSurname" ).val();
    var Password = $("#txtPassword").val();
    var PasswordR = $("#txtPasswordR").val();
    var DoB = $("#dteDoB").val();
    var Gender = $("#sltGender option:selected").val();
    var Response = grecaptcha.getResponse();
        $.post('functions/php/fncregister.php', {Forename: Forename, Surname: Surname, Password: Password, PasswordR: PasswordR, DoB: DoB, Gender: Gender, Response: Response}, function(data) {
            var returnValue = JSON.parse(data);
            if (returnValue['data'] == 0){
                $('#mdlInfo').html('<p>Your account has been created under the username: <strong><span id="spnUsername">'+returnValue['username']+'</span></strong>. You <strong>must</strong> remember this as you will require it to log into your account.</p><p>Your account has also been added to a moderation que. <strong>You must wait until a member of staff activates your account!</strong></p>');
                $("#mdlRegister").modal("show");
            }
            else if (returnValue['data'] == 1){
                $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">Passwords did not match!</p>');
            }
            else if (returnValue['data'] == 3){
                $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">An error occured when adding your details to the Database!</p>');
            }
            else if (returnValue['data'] == 4){
                $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">I don\'t like Robots! Make sure you complete the reCaptcha test.</p>');
            }
        });
}

Answer 1

我会尝试使用日期时间选择器插件来解决这个问题，该插件可以使用bootstrap运行良好。插件链接here。

请注意，在致电之前，您需要致电moment.js datetimepicker.js脚本。

＆＃13;

rdd.cache() // to make sure calculation of rdd is not repeated twice
val rdd1: RDD[String] = rdd.map(_._1)
val rdd2: RDD[String] = rdd.map(_._2)

＆＃13;

$(function () {
   $('#dteDoB').datetimepicker({
     format: 'DD/MM/YYYY'
   });
});

＆＃13;

新更新：

解决表单组对齐问题：

删除<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.43/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="http://momentjs.com/downloads/moment.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.43/js/bootstrap-datetimepicker.min.js"></script> <div class="container"> <br> <div class='col-xs-5'> <div class="form-group"> <div class='input-group date' id='dteDoB'> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> </div>内的类pull-right以获取datepicker。请参阅下面的标记：

input

日期时间选择器 - Chrome和Firefox之间的奇怪行为

1 个答案: