zoukankan      html  css  js  c++  java
  • #Java Web累积#JS动态加载所有同name的select的option

     
    项目需求:
      某一页面,页面使用多列table,每个table中有同相同的<select>,select的option不确定,根据Server端的配置来,所以option需要动态加载;

    以“provServicevalueSel”为列子;
    在JSP中:

    一,JSP中,启动读取session:
    <script type="text/javascript">
        var provType2List =<%=session.getAttribute("provType_2_list") %>;
    </script>

    .......................
    <body>
    .......................

      <select class="cell4_item_2 forClear" autocomplete="off" name = "provServicevalueSel"">
      </select>

    ........................
    </body>
    ........................

     二,检查数据:页面加载后,JS中自动启动数据检查。

        若Session中没有数据,启动数据请求;若有数据,则使用数据填充option;

    window.onload=function(){
        
        //加载列表
        loadAnalysisConfigList={
                initProvServiceData:function()
                {
                    if(provType2List && provType2List.length > 1)
                    {
                        RefreshProvValue(provType2List);
                        initData();
                    }
                    else
                    {
                        GetProvListByType("2");        
                    }
                }
        }
        
        loadAnalysisConfigList.initProvServiceData();
    }

    三,填充option; 以”

    //provServicevalue refrush
        function RefreshProvValue(provTypeList)
        {
            if(!provTypeList)
            {
                return;
            }
        
            $("select[name='provServicevalueSel']").each(function(n)
            {
                var provValuesel = $(this);
                provValuesel.find("option").remove();
                
                for(var i=0;i < provTypeList.length; i++)
                {
                    provValuesel.append("<option value='"+ provTypeList[i].id+"'>"+ provTypeList[i].name +"</option>");
                }        
            });    
        }

    或者

    function RefreshProvValue(provTypeList)
    {
      if(!provTypeList)
      {
       return;
      }
      var optionList = "";
      for(var i=0;i < provTypeList.length; i++)
      {
        optionList += ("<option value='"+ provTypeList[i].id+"'>"+ provTypeList[i].name +"</option> ");
      }

      var provSelArray = document.getElementsByName("provServicevalueSel");   
      for(var iDex = 0; iDex < provSelArray.length; iDex ++)   
      {     
        provSelArray[iDex].innerHTML = optionList;
      }
    }

      备注:效果是可以的,只是不知道这样写有没有什么不好,后边再巩固吧。

  • 相关阅读:
    轮询算法
    随机算法
    加权随机算法
    平滑加权轮询算法
    预训练模型与Keras.applications.models权重资源地址
    多通道卷积操作解析
    Squeeze-and-Excitation Networks
    实验数据集概况
    Keras-图片预处理
    Keras常用层
  • 原文地址:https://www.cnblogs.com/Sanje3000/p/6587555.html
Copyright © 2011-2022 走看看