Question

我有这样的jquery日历代码

<script>
$(document).ready(function() {
    $( #calTwo ).jCal({
        day: new Date( (new Date()).setMonth( (new Date()).getMonth() + 2 ) ),
        days: 7,
        showMonths: 1,
        monthSelect:    true
    });
});
</script>

在我的身体比赛中

<body>
<span id="calTwo"></span>
</body>

上述代码运作良好,但我的要求是,不要使用跨 ID 标记,我需要使用文本字段,而贴近文本字段的一个日历图像。点击该图像日历应该显示,不管我所选择的日期在文本字段中显示,点击该图像日历应该显示,也不管我选择的日期是什么。

我对Jquery是新来的不知道该如何执行这个特写有什么帮助吗?

Answer 1

类似 :

<input id="calTwo" /> <img src="..." id="calTwoIcon" />

<script>
$( #calTwoIcon ).click(function() {
    $( #calTwo ).focus();
});
</script>

您正在寻找的就是这个吗? 我刚刚放置了一个图像, 并指派了一个点击事件, 被调用时会聚焦日历中应该显示日历的输入。或者您可以做 < code>$ (# cal2). trigger (点击); 。

Answer 2

您也可以使用jQuery UI dateparter

HTML :

Date: <input id="calTwo" type="text"></input>

标注描述 :

$(document).ready(function() {
    $( #calTwo ).datepicker().option({"setDate": new Date()});
});

Example: http://jsfiddle.net/YQ7k8/ The example is ugly because jsfiddle doesn t have jQuery UI css. Take a look at http://jqueryui.com/demos/datepicker/ to see how it might look with the right theme.

友情链接