2020/08/03 ——工作笔记：上传头像（会调用两个接口以及为什么原理等）， button input 以及textares的布局

我是新人，这是工作笔记，代码混乱，注意，只能由我自己理解。可以参考
今天我在工作当中还遇到了一个问题就是在我对盒子布局进行检查的时候，发现了input以及textarea上下排列的时候，居然有空隙，一开始琢磨了半天，并且发现不了问题的存在，后来我突然想起来img有的时候布局也会出现问题，但是之前将img的display改为了block之后我就发现可以解决了，然后将这个方法运用到input以及button中也是一样得，如果我们遇到了盒子布局得错乱，导致我们找不到原因得时候我们就需要考虑是不是没有改变display为block了。比如出现盒子不能对齐空格等问题。

页面刷新：这是我在工作中遇到得问题。

 // 页面刷新
    location.reload();

上传头像和保存头像不至于页面刷新的时候头像没有，第一个，因为我们需要点击上传头像，然后调取后台接口，所以在用户下次登录的时候，它就需要再次点击才能上传头像了，不利于用户的体验，所以我们需要在第一次上传头像的需要调取两个接口，一个接口的作用是为了将本地照片上传到服务器，这样服务器就会返回一个头像地址，这个头像地址我们可以理解为在线的头像，就是服务器的头像，然后我们前端就可以把这个在线的头像进行上传到用户的头像，这样第一个接口的作用我们就这样实现了，目的就是为了得到服务器的头像然后保存到本地客户端上，由于用户是点击了之后然后上传头像的，所以在用户下次继续登录的时候，在没有点击上传头像的时候，这就会造成显示不了头像的问题，所以我们需要使用第二个接口，这个接口的作用是为了保存用户之前的操作，我们在第一个接口调用之后得到服务器地址之后我们还需要将头像继续保存到下一个接口，这应该是后台的操作，暂时不用理解后台是怎么操作的就行，只需要调取接口就行了。然后以下的是我在工作中的利用ajax来上传头像的js代码，

  // 从拍照选取图片自动触发事件
             $('#choose_file_capture').change(function()  {
               
            let  file  =  $("#choose_file_capture")[0].files[0];    //选择的图片文件
            console.log($("#choose_file_capture")[0]);            
            let  formDatas  =  new  FormData();            
            formDatas.append('file',  file);
            console.log(file)
            $.ajax({
   
                url: 'http://mobile.btcnews.online/index.php/api/Headsculpture/get_path',
                type: 'post',
                processData: false,
                contentType: false, //"multipart/form-data"
                data: formDatas,
                dataType: "json",
                success: function(data, id) {
   
                    console.log(data, id)
                    Api.doPost("Headsculpture/upload_Headsculpture", {
    path: data.url, id