Question

我正在将CSS文件的内容加载到我的textarea中，但是不知何故textarea无法正确显示它。第一行和最后一行还是不正确。

例如，我正在加载如下内容：

.notifications {
  position: fixed;
  z-index: 9999;
}

...

.notifications > div {
  position: relative;
  margin: 5px 0px;
}

但是textarea的格式如下：

                .notifications {
  position: fixed;
  z-index: 9999;
}

.notifications > div {
  position: relative;
  margin: 5px 0px;
}1

以某种方式将很多空格添加到第一行，并将“ 1”添加到最后一行。如果删除文本区域中的空格和“ 1”并保存，则按照“有效载荷”发送：

"""
.notifications {\n
  position: fixed;\n
  z-index: 9999;\n
}\n
\n
/* Positioning */\n
.notifications.top-right {\n
  right: 10px;\n
  top: 25px;\n
}\n
\n
.notifications.top-left {\n
  left: 10px;\n
  top: 25px;\n
}\n
\n
.notifications.bottom-left {\n
  left: 10px;\n
  bottom: 25px;\n
}\n
\n
.notifications.bottom-right {\n
  right: 10px;\n
  bottom: 25px;\n
}\n
\n
/* Notification Element */\n
.notifications > div {\n
  position: relative;\n
  margin: 5px 0px;\n
}
"""

这是html：

<div class="form-group">
    <textarea class="form-control" rows="10" class="js-public-css" name="public_css">
        {{ include resource_path("/{$file}") }}
    </textarea>
    <input type="hidden" class="js-css-file-name" value="{{ $fileValue }}">
    <button type="button" class="btn btn-success js-update-css-file-btn">
        Speichern
    </button>
</div>

这是js：

    $('.js-update-css-file-btn').click(function () {
        const content = $(this).prev().prev().html();
        const file = $(this).prev(".js-css-file-name").val();
        // console.log("content"+content);
        // console.log("file"+file);
        axios.post('brand/update', {
            file: file,
            content: content
        })
        .then((response) => {
        })
        .catch((error) => {
        })
    })

我不知道为什么会这样。

Answer 1

由于在HTML的textarea标记之间确实有空格，因此您确实在文本区域中添加了空格，因此需要将它们彼此相邻（<textarea>...</textarea>）。

您获得的1可能是因为Axios查询正在处理CSS内容，就像是JSON。将查询格式标题设置为纯文本。

将CSS代码加载到textarea中，在最后一行添加1

1 个答案: