jQuery TimePicker主题不起作用 [英] jQuery TimePicker theme is not working
问题描述
我错过了什么?我的时间选择器看起来像这样，它不使用主题作为时间选择器.
What I have missed? My timepicker looks like this, it doesn't use the theme for timepicker.
内部html文件:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link type="text/css" href="css/jquery-ui-1.8.16.custom.css" />
<link type="text/css" href="css/jquery.ui.all.css" />
<style type="text/css">
#ui-datepicker-div, .ui-datepicker{ font-size: 80%; }
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
</style>
<script type="text/javascript" src="script/jquery-1.7.1.min.js" ></script>
<script type="text/javascript" src="script/jquery-ui-1.8.16.custom.min.js" ></script>
<script type="text/javascript" src="script/jquery-ui-timepicker-addon.js" ></script>
<script type="text/javascript" src="script/jquery-ui-sliderAccess.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
$("#time").timepicker({
addSliderAccess: true,
sliderAccessArgs: { touchonly: false }
});
});
</script>
</head>
<body>
<input type="text" value="" id="time" />
</body>
</html>
我是否有错误的js文件加载顺序?
Do I have wrong order of loading for js files?
一些参考链接.
jsfiddle.net/MyNameIsCode/eb8Dz
提前谢谢！
推荐答案
您下载的主题是否具有主题名称?有时主题CSS路径可能需要包含该名称...例如，如果主题名称为"自定义主题"，则将是这样的:
Does the theme that you downloaded have a theme name? Sometimes the theme CSS path might need to include that name... for example, if the theme name is "custom-theme", it would be like this:
<link type="text/css" href="css/custom-theme/jquery-ui-1.8.16.custom.css" />
除非您确定CSS文件的路径正确无误.从您的第一个屏幕截图看来，似乎实际上并未找到CSS部分.
Unless you are sure that the paths are correct for your CSS files. It just seems like the CSS part isn't actually getting found, from your first screenshot.
查看下面的链接后，看来jquery-ui主题CSS文件(特定的 Overcast 主题CSS文件)有问题. CSS链接到这样的东西:
After looking at the links below, it looks like there's a problem with the jquery-ui theme CSS file (that particular Overcast theme CSS file.) It seems to work if I change out that top CSS link to something like this:
<link type="text/css" rel="stylesheet" href="http://trentrichardson.com/examples/timepicker/css/ui-lightness/jquery-ui-1.8.16.custom.css" />
还请注意:CSS链接似乎需要额外的内容:
Also note: that CSS link seemed to need the extra:
rel="stylesheet"
在里面...否则它仍然不会正确显示.
in there... otherwise it still wouldn't appear correctly.
ui-lightness 主题可能不是您想要的...但是，我可能会尝试重新下载 Overcast 主题以查看是否有效
The ui-lightness theme might not be what you are looking for... but, I would probably try re-downloading the Overcast theme to see if that works.
这篇关于jQuery TimePicker主题不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
