Logmessages HTML / JS的文本框

Question

在創建自己的解決方案之前，我嘗試找到一些已經滿足我需求的東西。 我有一個node.js服務器，其中有多個客戶端/應用程序連接到該服務器。 這些客戶端會將日志消息發送到服務器，我想在面板中顯示該消息。

現在，我需要一些用於Logmessages的典型多行文本框的功能 ：

• 我需要能夠附加日志消息，因為它們將通過websockets定期發送
• 除非用戶選擇文本或向上滾動，否則它應該自動向下滾動
• 它應該能夠使用顏色和粗體/常規

我的問題：

上面的用例已經有解決方案了嗎？

Answer 1

我可以舉一個例子嗎？ 它曾經是一個textarea但我將其重構為一個div ，幾乎沒有代碼更改。

代碼的一些重點，可以在github上找到

一個自定義函數，用於發送日志消息 ：

/**
 * Add a message to the gamelog
 * @param {Object} options : allows custom output
 * @param {String} options.message : the message to display
 * @param {Boolean} options.isTimed : does the message has a timestamp in front of it?
 * @param {Boolean} options.isError : is the message an error?
 * @param {Boolean} options.isNewline : start the message on a new line
 */
addMessage: function (options) {
    var instance = ns.instance,
        audio = instance.audio,
        audiofx = audio.settings.fx,
        history = this.areaMessage.html();

    // isTimed?
    options.message = options.isTimed
        ? history + this.fieldClock.val() + ': ' + options.message
        : history + options.message;

    // isNewline?
    if (options.isNewline) {
        options.message = options.message + '<br />';
    }

    // message
    this.areaMessage.html(options.message);
    this.scrollTop(this.areaMessage);

    // isError?
    if (options.isError) {
        audio.play(audiofx.error);
    }
},

滾動到頂部功能：

/**
 * Automatically scroll down (from the top)
 * @param {Object} target : jQuery object
 */
scrollTop: function (target) {
    target.scrollTop(99999);
    target.scrollTop(target.scrollTop() * 12);
}

要使用彩色消息，您應該能夠使用HTML字符串：

log.addMessage({
    message: '<span style="color: red;">[ERROR]</span>&nbsp;',
    isNewLine: false
});

log.addMessage({
    message: 'the rest of the error message',
    isNewLine: true
});

隨意使用此想法來注冊您自己的自定義消息框。