zarkfx 日期选择器 datepicker，让不懂程序的人也能使用js效果

爱意满满的作品展示区。

This topic created in 4787 days ago, the information mentioned may be changed or developed.

之前有说过我们做的js库，就是在html代码中通过fx属性来实现常见js功能

今天，我向大家介绍其中的“日期选择器”，你只需要在你的网页里的<head>标签中添加如下两句就可以使用fx了(如果已经加载了jQuery的话，仅需要第二行即可):

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://zarkfx.com/_static/zarkfx.js"></script>

添加如上两句引用代码后，你就可以轻轻松松给你的input标签添加日期选择功能了，比如:


<input type="text" fx="datepicker" />


<input type="text" fx="datepicker[style=dot-luv]" />


<input type="text" fx="datepicker[style=dot-luv;showAnim=clip;]" />


<input type="text" fx="datepicker[style=dot-luv;changeYear;changeMonth;]" />

您可以在此fx的页面中分别把以上代码复制到输入框中，然后点击“Try it”按钮尝试不同的效果：

http://zarkfx.com/auto_gen/datepicker.html

type

Text

5 replies • 1970-01-01 08:00:00 +08:00

sdjl

Apr 2, 2013

不好意思，刚才测试的时候发现jquery-1.3.2有点bug，暂时请把第一个js的地址改为 http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js

你也可以直接保存一下html代码，然后用浏览器打开测试：

<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://zarkfx.com/_static/zarkfx.js"></script>
</head>
<body>
<input type="text" fx="datepicker" value="" />
</body>
</html>

sdjl

Apr 2, 2013

尼玛，上一个又写错了。。。改为 jquery-1.7.2 。。。。。

http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

airyland

Apr 2, 2013

个人建议，用HTML5的 data- 来命名属性比较规范，我会写成 data-fx

sdjl

Apr 2, 2013

@airyland 这个值可以自己改的 :)

sdjl

Apr 3, 2013

难道没有人尝试？