设置 Telerik <ol> 列表字体大小的问题

Question

实际上

<ol>

标签字体大小在收到输出后变为

1

，即使

<li><font>listItem01</font></li>

字体大小更大（1,, 2, 3, 4, 5, 6, 0r 7），所以这里使用来自

Telerik

的 RadEdior，实际上 Telerik 有 1 到 7 种字体大小，因此根据 Telerik 解决方案，我尝试使用该特定

<ol>

的第一个

项目字体大小设置

<ol>

的字体大小。

这就是我尝试过的

function OnClientCommandExecuting(sender, args) {
    let commandName = args.get_commandName();
    if (commandName === "InsertOrderedList") {
        let doc = sender.get_document();

        setTimeout(function () {
            let olElements = doc.getElementsByTagName("ol");

            if (olElements.length > 0) {
                let getLastOrderList = olElements[olElements.length - 1];
                let firstListOfOrderList = getLastOrderList.getElementsByTagName("li")[0];

                if (firstListOfOrderList) {
                    let fontElements = firstListOfOrderList.getElementsByTagName("font");
                    let firstLiFontSize = 'small'; 

                    if (fontElements.length > 0) {
                        let firstFontTag = fontElements[0];
                        let fontSize = firstFontTag.getAttribute("size");

                        if (fontSize) {
                            fontSize = parseInt(fontSize, 10);
                            switch (fontSize) {
                                case 1: firstLiFontSize = 'x-small'; break;
                                case 2: firstLiFontSize = 'small'; break;
                                case 3: firstLiFontSize = 'medium'; break;
                                case 4: firstLiFontSize = 'large'; break;
                                case 5: firstLiFontSize = 'x-large'; break;
                                case 6: firstLiFontSize = 'xx-large'; break;
                                case 7: firstLiFontSize = 'xxx-large'; break;
                                default: firstLiFontSize = 'small'; 
                            }
                        }
                    }
                    getLastOrderList.style.fontSize = firstLiFontSize;
                }
            }
        }, 0);
    }
}

实际上上面的代码按照我的预期生成了输出，但我需要以不同的方式获取输出

所以，我需要修改代码以达到我预期的输出 我需要

• 删除硬编码的 switch case 语句
• 删除setTimeOut方法，不影响当前功能
• 获取输出

  html

  代码而不实现如下所示的包装功能

1. 测试

下面我附上了编辑器视图的屏幕截图

编辑器视图截图

编辑器视图的输出如下

<ol style="font-size: small;">
    <li>test</li>
    <li>s</li>
</ol>
<p>&nbsp;</p>
<ol style="font-size: x-small;">
    <li>
        <font size="1">sds</font>
    </li>
    <li>
        <font size="1">f</font>
    </li>
    <li>
        <font size="1">ff</font>
    </li>
</ol>
<p>
    <font size="1">&nbsp;</font>
</p>
<ol style="font-size: medium;">
    <li>
        <font size="3">sdssds</font>
    </li>
    <li>
        <font size="3">d</font>
    </li>
    <li>
        <font size="3">sd</font>
    </li>
</ol>
<p>
    <font size="3">&nbsp;</font>
</p>
<ol style="font-size: x-large;">
    <li>
        <font size="5">sd</font>
    </li>
    <li>
        <font size="5">sd</font>
    </li>
    <li>
        <font size="5">ds</font>
    </li>
</ol>

让我们清楚地看到输出，每个

<ol>

元素都采用

li

中第一个

<ol>

的字体大小，所以这个输出是完全正确的，所以与我需要在上面的 Telerik Solution 的帮助下获得输出相同提到的要求

因此，如果您对此有任何想法，请查看并告诉我

Answer 1

我从 Telerik 官方方面得到了答案，所以请使用下面的代码来解决这个问题

  function OnClientCommandExecuting(editor, args) {
      let commandName = args.get_commandName();

      if (commandName == "RealFontSize" || commandName == "FontSize") {
          let selElem = editor.getSelectedElement(); 

          if (selElem.tagName == "LI" || selElem.tagName == "UL" || selElem.tagName == "OL") {
               selElem.style.fontSize = fontSizeIntoPixels(args.get_value());
          } else selElem.style.fontSize = fontSizeIntoPixels(args.get_value());
          args.set_cancel(true);
      }
  }

  function fontSizeIntoPixels(fsValue) {
      switch (fsValue) {
          case 1:
              return "10px";
              break;
          case 2:
              return "13px";
              break;
          case 3:
              return "16px";
              break;
          case 4:
              return "18px";
              break;
          case 5:
              return "24px";
              break;
          case 6:
              return "32px";
              break;
          case 7:
              return "48px";
              break;
      }
  }