H5皮肤下，根据流程状态标签改变视图正行颜色

【公司名】：北京智源普华信息技术有限公司
【myApps/OBPM版本号】：
【系统版本】：后台 - 系统信息 - 系统版本：weioa365        30204
【浏览器类型】：Chrome、IE
【联系方式-QQ】：994641698
【联系方式-电话】：15963132648
【问题描述】：
通过在查询表单添加jQuery，在视图列中添加脚本的方式，实现根据流程状态标签改变视图行颜色，现在这个平台经典皮肤模式下可以实现，H5皮肤模式下无法实现，请求协助，代码如下：
//在查询表单里的源代码代码里增加如下：
<script>
jQuery(document).ready(function(){
        setTimeout(function(){
                jQuery("div.changeColor_red").each(function(){
                                        jQuery(this).parents("tr").find("td").find("a").css("color","#FF0000");
                });
  jQuery("div.changeColor_blue").each(function(){
                                       jQuery(this).parents("tr").find("td").find("a").css("color","#111FEE");
                                                        });
  jQuery("div.changeColor_green").each(function(){
                                        jQuery(this).parents("tr").find("td").find("a").css("color","#408A10");
                });
  jQuery("div.changeColor_black").each(function(){
                                        jQuery(this).parents("tr").find("td").find("a").css("color","#000000");
                });
        },300);
});
</script>
//在视图里编号列中增加脚本：
var flowType= getCurrentDocument().getLastFlowOperation();
var bh = getItemValueAsString("编号");
var state = getCurrentDocument().getStateInt();
var col=bh;
if(flowType==8){//表示流程终止
   col += "<div class='changeColor_red' style='display:none;'></div>";
}else if(state==256){//审批中
         
    col += "<div class='changeColor_blue' style='display:none;'></div>";
}else if(state==1048576){//审批通过
        // rtn = "<font color='#00FF00'>"+bh+"</font>";//设置不同状态时候字段值显示的颜色
   col += "<div class='changeColor_green' style='display:none;'></div>";
}else{
        //rtn="<font color='#000000'>"+bh+"</font>";}
col += "<div class='changeColor_black' style='display:none;'></div>";
}
col;

这是由于经典皮肤和H5皮肤在dom结构上不一样造成的，原理和思路都没有错，只是jQuery(this).parents("tr").find("td").find("a").css("color","#408A10");中的查找元素的层次结构要调整一下。

Jarod 发表于 2018-3-23 14:57
这是由于经典皮肤和H5皮肤在dom结构上不一样造成的，原理和思路都没有错，只是jQuery(this).parents("tr"). ...

有没有具体的调整示例啊？

你可以先打开h5皮肤模式下，谷歌浏览器右键审查查看h5皮肤下表格dom结构的变化重新写你的jquery代码既可以,上面已经说过了经典皮肤的dom节点结构和h5皮肤的dom节点结构是不一样的,你需要的话得自己去按我上面的方法去查看h5皮肤的dom结构然后写上对应的jqery代码既可,然后h5皮肤没有记错的话视图列表的那个table id是dataTable-box 你可以去找下 ,然后调整你的jquery代码。然后你可能还需要去找下h5皮肤的列表视图的jsp，那个jsp是叫做listView.jsp 应该是这个名字。

meiji 发表于 2018-3-23 19:03
你可以先打开h5皮肤模式下，谷歌浏览器右键审查查看h5皮肤下表格dom结构的变化重新写你的jquery代码既可以, ...

能给写一个示例吗？

您好，您这边是有我们的源码吗？因为关于这一块我们是没有案例的哦，您根据我4楼的描述去做，遇到问题再进行交流解决。如果您没有源码的话您的这个需求是实现不了的。

问题已解决，可以结贴