在家学习的第六周

这周感觉是踩坑最多的一周了，本来我写的帖子页面我用的富文本，感觉应该挺好配置的，我就用富文本写成csdn这种博客创造样式了，但是，还是出问题了，编辑框不能识别标签了，就是菜单栏里面的字体加粗啊和放大都不能用了，弄了半天没弄明白是咋回事的，后来一步一步拆分，还原，发现，本来富文本由编剧框和工具栏组成，是一体的，用一个div就行了，但是为了写成csdn这种样式的，我就是把这两个拆分开了，然后发现是因为link这个引用css文件的问题，由这个link存在，出现上述问题，然后我就想着把css都写在html'里面。本以为这样就结束了，然后又一个坑，叫我触不及防，就是有个上传图像的功能，我按照文档上的，csdn上的配置了一天没弄出来，上传了，但是获取不到返回的图片的链接，哎，真是可难受了那感觉，然后我就用input框进行代替，在点击上传图片窗格的时候触发input:file,下面上代码

还规定了，图片上传的格式的限制，和向我的编辑框中插入图片：

img.addEventListener("click", function () {
    uploadImg.click() //上面的用click，下面的用onchange
})

uploadImg.onchange = function () {
    let file = this.files[0]
    readFile(file)
    function errword() {
        console.log("非图片文件");
    }
    function readFile(file) {
        var reader = new FileReader()
        console.log(file.type);
        switch (file.type) {
            case 'image/jpg':
            case 'image/png':
            case 'image/jpeg':
            case 'image/gif':
                reader.readAsDataURL(file)
                break
            default: errword()
                break
        }
        function UploadImg(flie) {
            var formData = new FormData();
            formData.append("file",file)
            $.ajax({
                url: "http://110.40.211.224:8080/xingchen/user/picture",
                type: "POST",
                cache: false,
                data: formData,
                processData: false,
                contentType: false
            })
            .then(data=> {
                console.log(data);


                let url = data.msg
                console.log(text.innerHTML);
                let w_e_text = document.querySelector('.w-e-text')
                console.log(w_e_text);
                w_e_text.innerHTML = w_e_text.innerHTML + `<img src=${url} style="max-height: 200px ;display: inline-block"><br>`
            })
        }
        reader.addEventListener('load', function () {
            UploadImg(file)
        })
    }
}