Question

我在页面上运行此时间戳（http://timepicker.co/）时遇到问题。

我头脑中有这个

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>

我的脚本中有这个

var hDeb = document.createElement("input"); 
hDeb.className = "hDeb timepicker";

这在下面的另一个脚本中

$(document).ready(function() {
        $('.timepicker').timepicker({});
    });

没有显示错误，但输入只是一个输入文本

Answer 1

您需要将let subject = new Subject(); //global variable this.storage.get('user').then(res => { xyz = res.accessToken; this.subject.next(xyz); }); this.subject.subscribe(data => console.log(data)); //somewhere附加到DOM中的元素，以便在其上初始化时间戳。试试这个：

input

var hDeb = document.createElement("input");
hDeb.className = "hDeb timepicker";
document.body.appendChild(hDeb); // add this line

$(document).ready(function() {
  $('.timepicker').timepicker();
});

或者你可以纯粹在jQuery中完成它：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>

Answer 2

如果您在添加<input class="timepicker">之前尝试初始化timepicker，那么您的$('.timepicker')选择器将返回零元素，并且没有任何效果，您可以在下一个代码段中看到：

// DOES NOT WORK
$(document).ready(function() {
  $('.timepicker').timepicker();
  $('body').append('<input type="text" class="hDeb timepicker" />');
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>

您需要先添加输入，然后选择它并初始化timepicker：

// WORK
$(document).ready(function() {
  $('body').append('<input type="text" class="hDeb timepicker" />');
  $('.timepicker').timepicker();
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>

Answer 3

尝试替换

$('.timepicker').timepicker({});

由此

$('.timepicker').timepicker();

jquery timepicker cdnjs.cloudflare不起作用

3 个答案: