两个日期选择器在同一页面上?

时间:2012-09-21 10:10:48

标签: javascript

我认为这应该有效,但事实并非如此。我哪里出错了?

<link rel="stylesheet" type="text/css" media="all" href="jsDatePick_ltr.min.css" />

<script type="text/javascript" src="jsDatePick.min.1.3.js"></script>

<script type="text/javascript">
window.onload = function(){
    new JsDatePick({
        useMode:2,
        target:"inputField",
        dateFormat:"%j-%n-%Y"
    });
};
</script>

这是日期选择器脚本,在一个页面上有一个日期选择器正常工作,但我的要求是有两个。

我做了:

 From Date :<input type="text" size="12"  name="date1" id="inputField"    
readonly="readonly"/>  


To Date :<input type="text" size="12"  name="date2" id="inputField"  
readonly="readonly"/>

但它不起作用。日期选择器仅显示第二个输入字段。如果我要创建两个ID,那么我必须两次创建相同的函数吗?我也这样做了,但没有帮助。

2 个答案:

答案 0 :(得分:3)

同一页面中的两个元素不能具有相同的 id。您可以尝试以下代码:

<script type="text/javascript">
window.onload = function(){
 new JsDatePick({
    useMode:2,
    target:"inputField",
    dateFormat:"%j-%n-%Y"
});

 new JsDatePick({
    useMode:2,
    target:"inputField2",
    dateFormat:"%j-%n-%Y"
});
};
</script>

HTML可以如下所示:

 From Date :<input type="text" size="12"  name="date1" id="inputField"    
readonly="readonly"/>



To Date :<input type="text" size="12"  name="date2" id="inputField2"  
readonly="readonly"/>   

希望它有所帮助。

答案 1 :(得分:2)

尝试为不同的时间戳使用不同的目标。

<script type="text/javascript">
window.onload = function(){
 new JsDatePick({
    useMode:2,
    target:"inputField",
    dateFormat:"%j-%n-%Y"
});
 new JsDatePick({
    useMode:2,
    target:"inputField2",
    dateFormat:"%j-%n-%Y"
});

};
</script>