@52fhy 2016-01-22T08:23:39.000000Z 字数 1412 阅读 479

04-backbone模型--与服务器进行交互

backbone

<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>title</title>
    <script src="http://the5fireblog.b0.upaiyun.com/staticfile/jquery-1.10.2.js"></script>
    <script src="http://the5fireblog.b0.upaiyun.com/staticfile/underscore.js"></script>
    <script src="http://the5fireblog.b0.upaiyun.com/staticfile/backbone.js"></script>
</head>
<body>
<script>
    var Man = Backbone.Model.extend({
        initialize: function(){
            //事件绑定
            //object.on(event, callback, [context])别名: bind 
            this.on("change:name", function (model) {
                 console.log('name被改变为：' + this.get('name'));
                 //console.log(model); 
            });
            this.on('invalid', function (model, error) {
                 console.log(model);
                 console.log(error);
            });
        },
        //默认属性
        defaults: {
            name:'张三',
            age: '38'
        },
        validate:function(attr){
            if(attr.name == '') {
                return "name不能为空！";
            }
        },
        url:"/dayun/api/Test/hello_post", //注意不同域名跨域问题
    });
    var man = new Man();
    //model.save([attributes], [options]) 
    //会发送POST到模型对应的url，数据格式为json,即defaults里的数据
    //man.save();
    //model.fetch([options]) 
    //调用fetch方法是又会发送get请求到server端
    //man.fetch();
    //可以重新指定url还有回调
    man.fetch({
        url:'/dayun/api/Test/hello',
        success:function (model,res,options) {
             console.log(res);
        },
        error:function (model,res,options) {
             console.log(res);
        }
    });
    //post请求。不支持改url
    //前面的参数将与defaults合并，即{name: "张三", age: "38", param1: "122222"}
    //前面的参数也可以用对象的形式传多个：man.save({"p1":"12", "p2":"22"}, {});
    man.save("param1", "12", {
        success:function (model,res,options) {
             console.log(res);
        },
        error:function (model,res,options) {
             console.log(res);
        }
    });
</script>
</body>

04-backbone模型--与服务器进行交互

内容目录