bxpcn 发表于 2015-6-26 10:31:56

【分享】单选框JS响应点击,填写和查看JS特效。

本帖最后由 bxpcn 于 2016-3-3 16:56 编辑

up by bxpcn 2016-03-03
完整表单源码。
用法:新建一个工作流表单,切换到源码,粘贴,再切换到表单,保存,预览,即可使用。
【售前支持申请单】工作流设计表单,完整源代码。
发帖超数,改用TXT附件。
TXT附件不支持。。。压缩成ZIP了。



有疑问再继续交流。

设计需求,看2、3、4。。。楼的回帖。


DATA_9是单选框控件,看源码,不是标准RADIO控件。
DATA_9有5个单选项,设计是选中后,对应的文字<font size="4" id="lcf1">到5,自动变红色。
在JS中中加入以下代码,不生效。。。
想做成函数,又找不到RADIO触发的入口。。。

请教各位单选框的触发实现。。。
var allradio=document.getElementsByName("DATA_9");
for(var i=0;i<allradio.length;i++){
      allradio.onclick=function(){
                var num=1;
                for(var x=0;x<allradio.length;x++){
                        if(this==allradio){
                              num=x;
                        }
                }
                for(var j=1;j<=5;j++){
                        var label=document.getElementById("lcf"+j);
                        if(num==j-1){
                              label.color="red";
                        }else{
                              label.color="#000000";
                        }
                }
      }
}



通达史长根 发表于 2015-6-26 14:11:38

您好,目前有关js特效这边指导不了。您可以尝试在其它地方搜索一下,如果js没有生效,在控制台里面是可以看到js报错的。希望我的回答可以帮到您。

bxpcn 发表于 2015-6-27 14:10:00

只能自己整了。。。

正在改善页面显示:
单选框,n=1到5选项;
选n则显示表单n,其他隐藏并清空值;
改善业务员填写工作流的界面效果,更直观,减少误填项。

bxpcn 发表于 2015-6-27 14:13:27

本帖最后由 bxpcn 于 2015-6-27 14:15 编辑

这个需求是:填单人员错点/乱点/乱填内容时,导致多分支按条件跳转识别不准确。

不得不去改善填单界面。。。填什么就只显示什么,其他隐藏并清空值。

bxpcn 发表于 2015-6-29 10:43:04

优化-1,搞定,效果如下。






继续做 优化-2,选N显示N表单,隐藏其他表单并恢复初始值。


bxpcn 发表于 2015-7-10 22:23:43

一通百通
搞明白怎样在工作流里面加JS,剩下就简单了。

红字特效花了2天时间折腾,
这次优化工作流,隐藏表单,几分钟就搞定了。
效果如下:

选中和隐藏,对于选中表单。


完整JS源码分享:
var allradio=document.getElementsByName("DATA_9");
        for(var i=0;i<allradio.length;i++){
                allradio.onclick=function(){
                        var num=1;
                        for(var x=0;x<allradio.length;x++){
                                if(this==allradio){
                                        num=x;
                                }
                        }
                        for(var j=1;j<=5;j++){
                                var label=document.getElementById("lcf"+j);
                                if(num==j-1){
                                        document.getElementById( "ltr"+j).style.display= "";
                                        label.color="red";
                                }else{
                                        document.getElementById( "ltr"+j).style.display= "none";
                                        label.color="#000000";
                                }
                        }
                }
        }

bxpcn 发表于 2015-7-10 22:35:01

熟练使用JS的同学,
请加我Q 3375-79715 ,很多工作流的解决方案二开,需要用到JS实现。

请同学们多多指教。

bxpcn 发表于 2015-7-14 20:56:22

工作流JS效果,除打印外,分2种显示效果。

1.是填写表单。
如楼上JS特效。

2.是表单查看。
需要额外添加JS代码,如下。
<script language="jscript">
    var radiosk = document.getElementsByName("DATA_9");
    for(var i=0;i<radiosk.length;i++)
    {
      if(radiosk.checked)
      {
document.getElementById( "ltr"+(i+1)).style.display= "";
//alert(radiosk.value);
      }else {
document.getElementById( "ltr"+(i+1)).style.display= "none";
}

    }
</script>效果是:只显示选中的表单,其他隐藏。


bxpcn 发表于 2015-7-15 08:17:03

手机用户,新建工作流,所有JS特效统统失效。
可惜了。

hzshopping 发表于 2016-2-26 20:39:59

bxpcn 发表于 2015-7-10 22:23 static/image/common/back.gif
一通百通
搞明白怎样在工作流里面加JS,剩下就简单了。



兄弟, 表单里如何设置,LCF和L定义到什么位置。
页: [1] 2 3
查看完整版本: 【分享】单选框JS响应点击,填写和查看JS特效。