jquery日历控件如何显示图标?
How to show icon with jquery calender control?
我正在使用 jquery DateTimePicker,jquery.datetimepicker.full.js,我想用输入控件显示日历图标,但图标没有显示,有帮助吗?
我正在使用以下日期时间控件
http://www.htmldrive.net/items/show/1788/jQuery-plugin-select-date-and-time-DateTimePicker
请试试这个
继续添加这个CSS and JS
。
$(document).ready(function() {
$('#datetimepicker').datetimepicker({value:'1997/08/25 05:03', autoOpen:false,});
$('.fa-calendar').on('click', function () {
if($('.xdsoft_datetimepicker').css("display")=="block"){
$('.xdsoft_datetimepicker').css("display","none")
}else{
$('.xdsoft_datetimepicker').css("display","block")
}
});
$('#datetimepicker').on('focus', function () {
if($('.xdsoft_datetimepicker').css("display")=="block"){
$('.xdsoft_datetimepicker').css("display","none")
}else{
$('.xdsoft_datetimepicker').css("display","block")
}
});
});
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src='https://kit.fontawesome.com/a076d05399.js'></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.htmldrive.net/edit_media/2015/201512/20151207/datetimepicker-master/jquery.datetimepicker.css"/>
<script src="http://www.htmldrive.net/edit_media/2015/201512/20151207/datetimepicker-master/build/jquery.datetimepicker.full.js"></script>
<input type="datetimepicker" value="" id="datetimepicker">
<span class="fa fa-calendar"></span>
我正在使用 jquery DateTimePicker,jquery.datetimepicker.full.js,我想用输入控件显示日历图标,但图标没有显示,有帮助吗?
我正在使用以下日期时间控件 http://www.htmldrive.net/items/show/1788/jQuery-plugin-select-date-and-time-DateTimePicker
请试试这个
继续添加这个CSS and JS
。
$(document).ready(function() {
$('#datetimepicker').datetimepicker({value:'1997/08/25 05:03', autoOpen:false,});
$('.fa-calendar').on('click', function () {
if($('.xdsoft_datetimepicker').css("display")=="block"){
$('.xdsoft_datetimepicker').css("display","none")
}else{
$('.xdsoft_datetimepicker').css("display","block")
}
});
$('#datetimepicker').on('focus', function () {
if($('.xdsoft_datetimepicker').css("display")=="block"){
$('.xdsoft_datetimepicker').css("display","none")
}else{
$('.xdsoft_datetimepicker').css("display","block")
}
});
});
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src='https://kit.fontawesome.com/a076d05399.js'></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.htmldrive.net/edit_media/2015/201512/20151207/datetimepicker-master/jquery.datetimepicker.css"/>
<script src="http://www.htmldrive.net/edit_media/2015/201512/20151207/datetimepicker-master/build/jquery.datetimepicker.full.js"></script>
<input type="datetimepicker" value="" id="datetimepicker">
<span class="fa fa-calendar"></span>