Javascript JS链接-根据文本值更改单元格背景颜色

Javascript JS链接-根据文本值更改单元格背景颜色,javascript,sharepoint,Javascript,Sharepoint,我在Sharepoint中有一个任务列表,其中有一个标题为“健康”的专栏。此列包含文本值“绿色”、“红色”、“黄色”、“蓝色”和“灰色”的下拉列表 我想创建一个JS链接文件,仅基于这些文本值渲染单元格背景色 我使用脚本编辑器Web部件成功地做到了这一点,但我更愿意使用JS链接来实现这一点(我的页面上少了一个Web部件) 下面是我在脚本编辑器Web部件中插入的内容。我需要类似的JS链接文件的形式 <script type="text/javascript" src="//ajax.googl

我在Sharepoint中有一个任务列表,其中有一个标题为“健康”的专栏。此列包含文本值“绿色”、“红色”、“黄色”、“蓝色”和“灰色”的下拉列表

我想创建一个JS链接文件,仅基于这些文本值渲染单元格背景色

我使用脚本编辑器Web部件成功地做到了这一点,但我更愿意使用JS链接来实现这一点(我的页面上少了一个Web部件)

下面是我在脚本编辑器Web部件中插入的内容。我需要类似的JS链接文件的形式

<script type="text/javascript"
src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Blue')");
        $Text.css("background-color", "#0000FF");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Green')");
        $Text.css("background-color", "Green");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Canceled')")
        $Text.css("background-color", "#e18620");
    });
</script>

$(文档).ready(函数(){
$Text=$($td.ms cellstyle.ms-vb2:contains('Blue');
$Text.css(“背景色”,“#0000FF”);
$Text=$($td.ms cellstyle.ms-vb2:contains('Green');
$Text.css(“背景色”、“绿色”);
$Text=$($td.ms cellstyle.ms-vb2:contains('cancelled'))
$Text.css(“背景色”,“#e18620”);
});

我尝试了来自不同线程的多个代码片段,但没有任何效果。我的所有其他JS文件都正常工作,因此这是操作员错误或错误代码。

以下代码供您参考

<script type="text/javascript">
(function () { 
    // Create object that have the context information about the field that we want to change it's output render  
    var fieldContext = {}; 
    fieldContext.Templates = {}; 
    fieldContext.Templates.Fields = { 
        // Apply the new rendering for Available field on List View 
        "Health": { "View": fieldTemplate } 
    }; 
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(fieldContext);
})();  
// This function provides the rendering logic for list view 
function fieldTemplate(ctx) { 
    var health = ctx.CurrentItem[ctx.CurrentFieldSchema.Name];
    return "<span style='background-color: "+health+";'>" + health + "</span>";
}
</script>

(函数(){
//创建具有要更改其输出渲染的字段的上下文信息的对象
var fieldContext={};
Templates={};
fieldContext.Templates.Fields={
//为列表视图上的“可用”字段应用新渲染
“运行状况”:{“视图”:fieldTemplate}
}; 
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(fieldContext);
})();  
//此函数提供列表视图的呈现逻辑
函数字段模板(ctx){
var health=ctx.CurrentItem[ctx.CurrentFieldSchema.Name];
返回“+健康+”;
}

参考: