jquery - 如何在textarea上添加SQL格式化功能？

Question

我想实现在文本区域内格式化 SQL 的功能。因此，文本区域应该允许用户根据自己的兴趣缩进和突出显示某些文本( SQL )，我想使用 jquery 在警报框中显示格式化的查询。提前致谢。

Answer 1

您可以改进或使用以下 jquery 代码来格式化文本区域中的文本，然后使用警报框显示它。

为其创建适当的按钮，如下所示:

  var textInput = document.getElementById('textInput');
   var printButton = document.getElementById('printButton');
   var printBoldItalicButton = document.getElementById('printBoldItalicButton');
   var printFirstWordBoldButton = document.getElementById('printFirstWordBoldButton');
   var printDifferentStyleLinesButton = document.getElementById('printDifferentStyleLinesButton');
   var printOneOrTwoLinesBoldButton = document.getElementById('printOneOrTwoLinesBoldButton');

 printButton.onclick = function()
        {
            try
            {


                 //var text = textInput.value.split(' ');
                var text = textInput.value;

                var textMarkup = '';
                var fontSize = 64;
                for (var i = 0; i < text.length; ++i)
                {
                    textMarkup += '<font family="Arial" size="' + fontSize + '">' + escapeXml(text[i]) + '</font>';

                    fontSize = Math.max(2, fontSize / 8 * 7);
                }

                textMarkupInput.value = textMarkup;
     alert(textMarkupInput.value);
            }
            catch(e)
            {
                alert(e.message || e);
            }
        }

        printBoldItalicButton.onclick = function()
        {
            try
            {



                var text = textInput.value.split(' ');

                var textMarkup = '';
                for (var i = 0; i < text.length; ++i)
                {
                    if (i % 2)
                        textMarkup += '<b>' + escapeXml(text[i]) + ' </b>';
                    else
                        textMarkup += '<i>' + escapeXml(text[i]) + ' </i>';
                }

                textMarkupInput.value = textMarkup;
    alert(textMarkupInput.value);
            }
            catch(e)
            {
                alert(e.message || e);
            }
        }

        printFirstWordBoldButton.onclick = function()
        {
            try
            {

                var lines = textInput.value.split('\n');
                var textMarkup = '';

                for (var i = 0; i < lines.length; ++i)
                {
                    var text = lines[i].split(' ');
                    if (text.length >= 1)
                    {
                        textMarkup += '<b>' + escapeXml(text[0]) + ' </b>';
                        textMarkup += text.slice(1).join(' ');
                    }
                    textMarkup += '<br/>';
                }


                textMarkupInput.value = textMarkup;
          alert(textMarkupInput.value);
            }
            catch(e)
            {
                alert(e.message || e);
            }
        }

        printDifferentStyleLinesButton.onclick = function()
        {
            try
            {

                var lines = textInput.value.split('\n');
                var textMarkup = '<font family="Times New Roman">';

                var styles = ['', 'b', 'i', 'u', 's'];

                for (var i = 0; i < lines.length; ++i)
                {
                    var text = lines[i];
                    if (i >= styles.length || i == 0)
                        textMarkup += escapeXml(text);
                    else
                        textMarkup += '<' + styles[i] + '>' + escapeXml(text);

                    if (i == Math.min(styles.length, lines.length) - 1)
                    {
                        // 'close' all styles
                        for (var j = Math.min(styles.length, lines.length) - 1; j > 0; --j)
                            textMarkup += '</' + styles[j] + '>';
                    }

                    if (i < lines.length - 1)
                        textMarkup += '<br/>';
                }
                textMarkup += '</font>';


                textMarkupInput.value =textMarkup;alert(textMarkupInput.value);
            }
            catch(e)
            {
                alert(e.message || e);
            }
        }

        printOneOrTwoLinesBoldButton.onclick = function()
        {
            try
            {

                var lines = textInput.value.split('\n');

                var textMarkup = '';
                var boldLinesCount = lines.length <= 3 ? 1 : 2;

                if (lines.length > 0)
                {
                    textMarkup = '<b>';
                    textMarkup += escapeXml(lines.slice(0, boldLinesCount).join('\n'));
                    textMarkup += '</b><br/>';
                    textMarkup += escapeXml(lines.slice(boldLinesCount).join('\n'));
                }

                textMarkupInput.value = textMarkup;
     alert(textMarkupInput.value);
            }
            catch(e)
            {
                alert(e.message || e);
            }
        }