我有clockpicker(https://weareoutman.github.io/clockpicker/)作为在我的php页面上输入时间的工具,它包含许多类似但独特的字段。
它的工作原理如下:
<?php while // ...extracting data from mysql
// and we have got a lot of "cards" (Their quantity is not constant and there can be from 30 to 100 cards), each one of them has unique card_numuber and card_time
echo <div id='card'> ;
echo <div id='$row['card_numuber']'> $row['card_numuber']</div> ;
echo <div class='input-group clockpicker-with-callbacks'><input id='$row['card_numuber']' type='text' class='form-control' value=".$row['card_time']."></div>;
echo </div> ;
?>
这是我用来获取变量数据的脚本:
<script type="text/javascript">
$('.clockpicker-with-callbacks').clockpicker({
donetext: 'Done',
afterDone: function() {
var card_time = ??? // here is I have no idea how to get the~ <input value=".$row['card_time'].">
var card_numuber = ??? // and here I've got no clue how to mage var from dynamic id='$row['card_numuber']' value
console.log(card_numuber, card_time);
$.post( "2_settime.php", {
card_numuber: card_numuber, card_time: card_time
})
}
})
</script>
我需要以某种方式从html获取数据并将其传递给javascript ... 所以:
card_time
IS value=".$row['card_time']."
card_numuber
IS id='$row['card_numuber']'
我怎么能完成这么糟糕的任务呢?请帮忙。
答案 0 :(得分:1)
可悲的是,在查看源代码时,该插件未通过afterDone
回调任何有用。因此,为了知道哪些输入与之相关,我们将不得不以更冗长的方式解决问题:
// Normally, you'd avoid using `each` like this, but sadly this plugin calls
// its callbacks with NO context information
$('.clockpicker-with-callbacks').each(function() {
var input = $(this).find("input")[0];
$(this).clockpicker({
donetext: 'Done',
afterDone: function() {
var card_time = input.value; // The current value of the input
var card_numuber = input.id; // The input's ID
console.log(card_numuber, card_time);
$.post( "2_settime.php", {
card_numuber: card_numuber, card_time: card_time
});
}
});
});