0

我正在尝试在我的网站中实现 timepickr 元素,但是该元素似乎可以在页面的一个部分中正常工作,但在另一个部分中却不行。
我引用了相应的 css 文件……</p>

<link rel="Stylesheet" media="screen" href="ui.timepickr.css" /> 
<link rel="stylesheet" media="screen" href="jquery.timepickr.css" type="text/css" /> 

以及 jQuery 文件……</p>

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/jquery.ui.all.js"></script> 
<script type="text/javascript" src="js/jquery.timepickr.js"></script> 

这些文件的路径是正确的。我在页面头部写了jQuery函数……</p>

<script type="text/javascript"> 
 $(function(){
 $('#timestart').timepickr();
 });
</script> 

然后,在页面的主体中,我创建对象,引用 timepickr 函数……</p>

<input id='timestart' type='text' value='09:00' />

它工作正常。但是,当我稍后在同一页面中使用完全相同的代码时,timepickr 功能不会启动。

我希望该功能起作用的区域位于另一个 DIV 部分,其内容来自页面中的 Ajax 调用。
这是我在页面中唯一的 jQuery 项目。
页面 itelf 只有一个 timepickr 引用。

4

2 回答 2

0

ID 必须是唯一的。当你参考

 $('#timestart').timepickr();

它查看元素的 id 这由使用 '#' 表示因此,如果您使用相同的 id 超过每页 1x,它应该采用第一个,但如果您使用相同的 id 则这是无效标记超过 1 个元素。要解决这个问题

 $('#timestart1').timepickr();
 $('#timestart2').timepickr();

<input id='timestart1' type='text' value='09:00' />
<input id='timestart2' type='text' value='09:00' />
于 2010-07-26T15:04:16.770 回答
0

id 是唯一标识符,因此它必须是唯一的,您可以改用 class 属性

<script type="text/javascript"> 
 $(function(){
    $('.timestart')each(function(){
        $(this).timepickr();
     })
 });
</script>

<input class='timestart' type='text' value='09:00' />

我已经对其进行了测试(请参见下面的代码)并且可以正常工作。它接缝ajax导致问题

<html>
<head>
<link title="theme" type="text/css" href="http://ui.jquery.com/applications/themeroller/css/jquery-ui-base.css.php?ctl=themeroller&amp;=" media="screen" rel="Stylesheet" id="themeCSS" />
<link rel="Stylesheet" media="screen" href="css/jquery.utils.css" />
<link rel="Stylesheet" media="screen" href="css/ui.timepickr.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js" type="text/javascript"></script>
<script src="jquery.utils.js" type="text/javascript"></script>
<script src="ui.timepickr.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(".timepickr").each(function(){
        $(this).timepickr();
    })
});
</script>
</head>
<body>
<input class='timepickr' type='text' value='09:00' />
<input class='timepickr' type='text' value='12:00' />
<input class='timepickr' type='text' value='07:00' />
</body>
</html>
于 2010-07-26T15:07:46.463 回答