学习记录

   今天学到的东西，是一个完整的整合了php上传的图像裁剪jQuery js插件。
   核心插件的名字是 cropper.js  --->https://github.com/fengyuanchen/cropper/blob/master/dist/cropper.js ,工作原理应该是获取用户上传的图片后，把用户拖拽后的头像预览相对于原图片的位置和各种参数一起提交给php，最后由php完成图片裁剪的工作，并保存到本地。
  网上的项目  --->  http://www.sucaihuo.com/js/264.html
  完整的项目是由bootstrap，jQuery和cropper的前端，php的后台完成的，所以想要单独实现图片裁剪和上传的功能，只需要在bootstrap和jQuery的项目内，加上库文件cropper.js，一个写好的完整的调用文件main.js和cropper.js，和配套使用的css样式即可。
  对这个项目进行完善后，现在已经整合了上传到云服务器的功能，完成了对用户头像的更新。
  调BUG的人生果然是悲惨的www，因为对这个插件理解的不深入，还有代码中的一些小错误，调了一下午我们才完成了这一个功能。因为时间紧迫，没办法对代码进行深入的理解，下载的模板过了一遍就马上开始测试，略过种种小bug（比如动态加载的图片选择框不知道为什么没法点击......）最后遇到的BUG是因为储存路径造成的，模板内的html和php是在一个子目录里面的，图片默认储存在下一级目录upload里面，然而现在写的项目的php是单独在一个文件夹里面的，上传的图片也需要加上用户的信息，所以相互调用时就出现了问题。
  比如，前端需要crop.php返回一个裁剪后的图片的地址，而为了完成更多操作，crop.php必须调用其他php文件的函数，再加上没时间修改默认路径（各种BUG在修改路径的时候出现了，后来为了尽快排除问题，就使用默认的了），冲突就产生了：如果选择让前端获取到图片，php应该放在和html同级目录内，但php调用其他php文件的话，通过相对路径找到一个php是没问题......但是这个被调用的php文件通常会再调用其它php来完成进一步操作，第二次被调用的php就会因为文件域的问题，死在“404”中......然而，完全保证了php的正常后，前端就拿不到那个路径的图片了（图片存在于php的文件夹里面，html文件夹内用这个相对路径找不到图片），拿不到图片，AJAX就返回一个错误，页面就因为错误信息，显示不出修改后的图片，还卡在上传的那里......
  解决方案是机智的我修改了main.js,把AJXA关于失败的回调修改了，不管是成功还是失败，页面都会刷新，刷新后头像就自动加载成数据库内修改完后的头像的地址了~~~
  不能点击的BUG是在div内通过jQUery的load（）方法加载另外一个html文档解决的。
项目的github地址 --->      https://github.com/yuban12315/LoveUniversity