`
nikofan
  • 浏览: 229219 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类

jQuery MiniUI 快速入门：Hollo, world!（二）

jqueryjavascriptajaxdatagridgrid 
阅读更多
我们开始编写第一个MiniUI程序，代码如下：

<!DOCTYPE html />
<html>
<head>
    <title> Hello MiniUI!</title>
    <!--jQuery js-->
    <script src="../jquery.js" type="text/javascript"></script>
    <!--MiniUI-->
    <link href="../themes/default/miniui.css" rel="stylesheet" type="text/css" />       
    <script src="../miniui.js" type="text/javascript"></script>
</head>
<body>
    <input id="helloBtn" class="mini-button" text="Hello" onclick="onHelloClick"/>
    <script type="text/javascript">
        function onHelloClick(e) {
            var button = e.sender;
            mini.alert("Hello MiniUI!");
        }
    </script>
</body>
</html>

Note：请注意相关javascript和css的路径是否正确。

MiniUI是基于jQuery开发的javascript控件库，所以依赖jquery.js。jQuery版本1.4+即可。

效果图如下：


本例注意点如下：

    控件声明：class="mini-button"
    属性设置：text="Hello"
    事件绑定：onclick="onHelloClick"
    事件处理函数：onHelloClick的e是事件对象，e.sender是事件激发者，本例中是button。

运行示例
0
顶
0
踩
分享到：
| jQuery MiniUI 快速入门：下载安装（一）
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics