jqueryUI

angular dragdrop

beforeDrop : 是一个promise对象， 在交换之前选文信息，适用于弹出信息窗口。

var app = angular.module('app', ['ngDragDrop']);
 app.controller('oneCtrl', function($scope, $q){
     $scope.list1 = {
       title : 'Drag and Drop with default confirmation'
     };
     $scope.list2 = {};
     $scope.beforeDrop = function(){
         var deferred = $q.defer();
         if(confirm('are you sure?')){
           deferred.resolve();
         }else{
           deferred.reject();
         }
         return deferred.promise;
     };

 } )

<div class="col-sm-6">
      <div class="btn btn-primary" data-drag="true" ng-model = "list1" jqyoui-draggable = "{animate: true}" ng-hide = " !list1.title">{{list1.title}}</div>

  </div>
  <div class="col-sm-6" style="border:1px solid #ccc;height: 50px">
      <div data-drop="true" ng-model="list2" jqyoui-droppable="{beforeDrop : 'beforeDrop'}" ng-bind="list2.title ? 'dropSuceess' : 'Drop hree'"></div>
  </div>

jqueryUI-draggable API

$('selector').draggable({
      addClasses : false, //阻止 ui-draggable class被添加。
      appebdTo : '',//当拖拽时，draggable要追加到哪一个元素。
      axis :  "x"     , //   约束在水平轴 (x) 或垂直轴 (y) 上拖拽。可能的值："x", "y"。
      cancel : '.title'       , //防止从指定的元素上开始拖拽。
      containment :"parent"            , // 约束在指定元素或区域的边界内拖拽。 支持多个类型 。String：可能的值："parent"、"document"、"window"。
      cursor : 'crosshair', // 拖拽操作期间的 CSS 光标。
      disabled : true ,// 设置为true，禁止该draggale
      helper : 'clone', // 允许一个 helper 元素用于拖拽显示。如果设置为 "clone"，元素将被克隆，且克隆将被拖拽。
      opacity :'.5',// 当被拖拽时助手（helper）的不透明度。
      revert : true, // 当拖拽停止时，元素是否还原到它的开始位置。如果设置为 true，元素总会还原。
      scroll : true, //   如果设置为 true，当拖拽时容器会自动滚动。
  })

jqueryUI-droppable API

$('selector').droppable({
        accept : '.selector',  // 控制哪个可拖拽（draggable）元素可被 droppable 接受。
        activeClass : 'ui-state-highlight', // 如果指定了该选项，当一个可接受的 draggable 被拖拽时，class 将被添加到 droppable
        addClasses : false, // 如果设置为 false，将防止 ui-droppable class 被添加。
  })

ES6学习

ES6运行环境的搭建

摘录资源: http://blog.csdn.net/liuhe688/article/details/51212393
1.npm install -g babel-cli

1. 创建一 个存放ES6代码的文件夹（例如 es6）和一个存放解析后的ES5的文件夹(例如js),在使用命令初始化一个package.json文件:命令：npm init -y
2. 安装 ES6转码规则包：npm install babel-preset-es2015 --save-dev
3. 在es6文件夹中编写代码，编写之后

4. 在命令行中使用： babel es6/test.es6 --out-file js/test.js --presets es2015 编译

   `babel es6 --out-dir js --presets es2015` 对整个es6目录的文件进行编译
   

   记录点

   1. ES5规定，函数只能在顶级作用域和函数作用域下声明，不能在块级作用域下声明。