【问题标题】:Show the strikethrough and underline at the same time in the js tree在js树中同时显示删除线和下划线
【发布时间】:2020-05-21 04:18:46
【问题描述】:

我在 js 树中同时显示删除线和下划线时遇到问题。我的代码只能显示删除线,不能在 js 树中显示下划线。

下面是我的js函数:

    var colorNodes = function(nodelist) {
        var getStrike = function(status) {
      if (status === "0") {
        return "line-through;";
      }  else {
        return "";
      }
    };
        var getUnderline = function(add_underline) {
        if (add_underline === "1") {
            return "underline;";
        }  else {
        return "";
        }
        };
      var tree = $('#folder_jstree').jstree(true);
      nodelist.forEach(function(n) {
        tree.get_node(n.id).a_attr.style = "color:" + getColor(parseInt(n.text.substr(0, 3), 10))+ ";"+"text-decoration:" + getStrike(n.data.status);
        tree.redraw_node(n.id); //Redraw tree
        colorNodes(n.children); //Update leaf nodes
      });
    };

    $('#folder_jstree').bind('load_node.jstree', function(e, data) {
      var tree = $('#folder_jstree').jstree(true);
      colorNodes(tree.get_json());
    });


    $('#folder_jstree').bind('hover_node.jstree', function(e, data) {
      $("#" + data.node.id).attr("title", data.node.original.category);
    });

  });

这是我的 json 数据:

[{"id":"658","parent":"#","text":"100 PENTADBIRAN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"659","parent":"#","text":"200 PENGURUSAN TANAH & BANGUNAN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"660","parent":"#","text":"300 PENGURUSAN ASET <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":"","data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"661","parent":"#","text":"400 PENGURUSAN KEWANGAN <span id='category'>JKP<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JKP","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"662","parent":"#","text":"500 PENGURUSAN SUMBER MANUSIA <span id='category'>JKP<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JKP","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"663","parent":"658","text":"100-1 PERUNDANGAN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"664","parent":"658","text":"100-2 PERHUBUNGAN AWAM <span id='category'>JKP<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JKP","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"665","parent":"663","text":"100-1-1 PENGGUBALAN-PENYEDIAAN-PINDAAN UNDANG-UNDANG-PERATURAN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"666","parent":"663","text":"100-1-2 KHIDMAT NASIHAT <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"667","parent":"665","text":"100-1-1-1 UNDANG-UNDANG KECIL KERJA DI JALAN 1996 <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":"","data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"668","parent":"665","text":"100-1-1-2 UNDANG-UNDANG KECIL PERUNTUKAN MENGENAI LESEN BERSESAMA (MAJLIS PERBANDARAN) <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"670","parent":"666","text":"100-1-2-1 JABATAN PENGUATKUASAAN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"671","parent":"666","text":"100-1-2-2 JABATAN BANGUNAN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"672","parent":"664","text":"100-2-1 PUBLISITI, PROMOSI DAN PROTOKOL <span id='category'>JKP<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JKP","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"673","parent":"672","text":"100-2-1-1 PUBLISITI DAN KENYATAAN MEDIA <span id='category'>JKP<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JKP","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"674","parent":"665","text":"100-1-1-3 UNDANG-UNDANG KECIL MENGKOMPAUN KESALAHAN-KESALAHAN (MAJLIS PERBANDARAN KLANG) <span id='category'>JTM (BERHUBUNG KOD 100-1\/1\/2)<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM (BERHUBUNG KOD 100-1\/1\/2)","filing_code_refer":null,"data":{"status":"1"},"add_underline":{"add_underline":null},"state":{"selected":false,"opened":false}},{"id":"679","parent":"#","text":"516 JOHN <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":"","data":{"status":"1"},"add_underline":{"add_underline":"0"},"state":{"selected":false,"opened":false}},{"id":"680","parent":"679","text":"516-1 DAVID <span id='category'>JTM<\/span><span id='open'><\/span><span id='open'><\/span><span id='open'><\/span>","category":"JTM","filing_code_refer":"","data":{"status":"0"},"add_underline":{"add_underline":"1"},"state":{"selected":false,"opened":false}}]

这是我的 js 树输出:

对于我的js树输出示例516-1 DAVID,它可以做删除线,但不能同时做下划线。希望有人能指导我如何解决它。

如果有效,如下输出:

这是我的工作 js 小提琴:https://jsfiddle.net/ason5861_cs/kz89btox/1/

【问题讨论】:

    标签: javascript node.js jstree


    【解决方案1】:

    您可以同时返回underline and line-through 来解决您的要求。

    if (status === "0") {
       return "line-through underline;";
    } 
    

    替代方法。您可以调用此函数并将适当的值传递给此函数以使用。

    var getDecoration = function(status, underline) {
      if (status === "0" && underline === "1") {
        return "line-through underline;";
      } else if(status === "0") {
        return "line-through;";
      } else if(underline === "1") {
        return "underline;";
      } else {
        return "";
      }
    };
    

    【讨论】:

    • 感谢您的回答。但是我有两个带有status和add_underline的条件变量,如何分开显示下划线和删除线
    • 我有两个代码是 status === "0" 和 add_underline === "1"
    • 我不明白你的数据结构。但是您可以使用一个函数,然后处理其中的所有条件。
    • 嗨@Sifat Haque。我有一个类似于 js 编码的问题。如果你有时间可以帮我检查一下。谢谢。 stackoverflow.com/questions/62669094/show-color-in-js-nodes
    • @Ong 感谢您的提及。我发现你的问题已经解决了。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-05-12
    • 1970-01-01
    • 2013-08-22
    • 2016-08-26
    • 2017-03-23
    • 1970-01-01
    • 2021-01-22
    相关资源
    最近更新 更多