菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 杨国强20230112 [打印本页]

作者: 违心 时间: 2023-2-4 17:44
标题: 杨国强20230112
今日学习内容：超时时间<script>
   // timeout--是xhr的一个属性，用来设置超时时间
   // ontimeout--事件，一旦服务器返回的时间超时，取消本次ajax请求，触发ontimeout时间
   var xhr = new XMLHttpRequest();

   //设置超时时间服务器2秒没有响应视为超时
   //一旦超时就会触发ontimeout事件
   xhr.timeout=2000;
   xhr.ontimeout=function(){
      console.log('超时已取消');
   }
         xhr.open('get','http://162.14.107.109/list');
         xhr.send();
         onload---response
         xhr.onload = function () {
            console.log('onload',xhr.responseText);
         };
</script>
  //formData:能够一次性获取表单的所有数据
   // 使用步骤:
   // 1.获取整个表单对象
   // 2.实例化FormData，并讲表单对象作为参数传递给FormData()
文件上传 <script>
      //获取dom节点
      const ipt=document.querySelector('#ipttext');
      const file=document.querySelector('#file');
      // ipt.addEventListener('click',function(){
      //    console.log(111);
      // })
      //点击事件加给img
      //通过img点击事件，来触发input的file事件
      file.addEventListener('click',function(){
         ipttext.click()
      });
      //监听--input--type=file  的change事件
      ipt.addEventListener('change',function(){
         console.dir(this);
         console.dir(this.files);
         console.dir(this.files[0]);

         let fd=new FormData();
         fd.append('images',this.files[0]);
         fd.append('id',1174);

         axios.post('http://162.14.107.109/upload',fd).then(res=>{
            console.log(res);
            console.log(res.data.data.src);
            //把后端返回的图片路径，img，进行替换
            file.src='http://'+res.data.data.src;
         })
      });

</script>

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)