您的位置:首页 > 移动开发 > 微信开发

从微信公众平台扒下来的dropdown组件

2015-04-20 13:56 225 查看
微信公众平台使用了seajs开源框架,发现几乎都实现了组件化,比如:下拉菜单、富文本编辑器(虽然也是用的ueditor但是看起来更简单美观)、弹出层、图片上传等等。先实现了一个简单的下拉菜单,以后有时间试着把其他组件也扒下来。。。主要是所有js都压缩处理了,所以扒下来的js变量名都是各种abc,读起来非常蛋疼。

如果需要的话,我再把所有代码分享到云盘。。。

目录结构



展示效果



index.html代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>

        <link rel="stylesheet" href="css/base.css" />

        <link rel="stylesheet" href="css/dropdown.css" />

        <script type="text/javascript" src="js/sea.js"></script>

        <script type="text/javascript" src="js/common/jquery-1.10.2.min.js"></script>

        <script type="text/javascript" src="js/common/template-2.0.1.js"></script>

        <script type="text/javascript">
            seajs.use("main");
        </script>
    </head>

    <body>
        <div id="js_sex" class="dropdown_menu">
        </div>
        <button id="okbtn">确定</button>
    </body>

</html>

main.js

define("main.js", ["dropdown/dropdown.js"], function(require) {

    var a = require("dropdown/dropdown.js");

    var x = new a({
        container: "#js_sex",
        data: [{
            name: "全部",
            value: "0"
        }, {
            name: "男",
            value: "1"
        }, {
            name: "女",
            value: "2"
        }],
        callback: function() {}
    });
    x.selected(0);

    $("#okbtn").click(function(){
        alert(x.value);
        alert(x.name);
    });
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: