项目需求：
　　某一页面，页面使用多列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> \n");
　　}

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

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

#Java Web累积#JS动态加载所有同name的select的option的更多相关文章

  1. 记录Js动态加载页面.append、html、appendChild、repend添加元素节点不生效以及解决办法

    今天再优化blog页面的时候添加了个关注按钮和图片,但是页面上这个按钮和图片时有时无,本来是搞后端的,被这个前端的小问题搞得抓耳挠腮的! 网上各种查询解决方案,把我解决问题的艰辛历程分享出来,希望大家 ...

  2. js动态加载以及确定加载完成的代码

    利用原生js动态加载js文件到页面,并在确定加载完成后调用相关function var otherJScipt = document.createElement("script") ...

  3. js动态加载css文件和js文件的方法

    今天研究了下js动态加载js文件和css文件的方法. 网上发现一个动态加载的方法.摘抄下来,方便自己以后使用 [code lang="html"] <html xmlns=& ...

  4. ie6,7下js动态加载图片不显示错误

    ie6,7下js动态加载图片不显示错误 先描述一下出现这种匪夷所思bug的背景: 我在页面加载的时候加载一堆小缩略图,<a href="javascript:void(0);" ...

  5. js动态加载js css文件,可以配置文件后辍，防止浏览器缓存

    js的引用,在浏览器,或微信上访问经常会遇到文件改了,但就是没有更新的问题,使用此函数可以轻松解决缓存问题只需要把js的引用方式改为使用此函数加载即可 源码如下: /** * js动态加载js css ...

  6. 【译】12. Java反射——类的动态加载和重新加载

    原文地址:http://tutorials.jenkov.com/java-reflection/dynamic-class-loading-reloading.html 博主最近比较忙,争取每周翻译 ...

  7. js动态加载数据并合并单元格

    js动态加载数据合并单元格, 代码如下所示,可复制直接运行: <!DOCTYPE HTML> <html lang="en-US"> <head> ...

  8. java web eclipse中项目的加载过程

    java web eclipse中项目的加载过程: Tomcat默认从WEB-INF/目录下加载资源,Eclipse在发布程序的时候,并没有把User Libraries的相关资源拷贝到WEB-INF ...

  9. JS 动态加载脚本 执行回调

    JS 动态加载脚本  执行回调 关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件 ...

随机推荐

  1. 64_g2

    gettext-libs-0.19.8.1-9.fc26.x86_64.rpm 15-Mar-2017 14:15 305038 gf2x-1.1-9.fc26.i686.rpm 11-Feb-201 ...

  2. UNIX v6

    UNIX v6 http://download.csdn.net/download/u013896535/9106775 https://github.com/chromium/mini_chromi ...

  3. 004 ConcurrentHashMap原理

    下面这部分内容转载自: http://www.haogongju.net/art/2350374 JDK5中添加了新的concurrent包,相对同步容器而言,并发容器通过一些机制改进了并发性能.因为 ...

  4. tk界面版股票下载

    from tkinter import * import urllib.request import re,os import threading from tkinter import filedi ...

  5. python读写hdf5及cdf格式文件

    Python write and read hdf5 file http://stackoverflow.com/questions/20928136/input-and-output-numpy-a ...

  6. SEO优化：WordPress站点地图（html和xml）插件Baidu Sitemap Generator

    前阵子分享了<如何实现纯代码制作网站地图的html和xml版本>,不过不是每个人都喜欢用纯代码来折腾博客的.今天,boke112就给大家分享一款国人柳城制作的包含html和xml两个版本的 ...

  7. git------删除Repository

    需求:删除仓库 Lucky-Repository,实现步骤如下截图所示 如上完成删除操作

  8. sql中where和having的区别

    “Where” 是一个约束声明,使用Where来约束来自数据库的数据,Where是在结果返回之前起作用的,且Where中不能使用聚合函数. “Having”是一个过滤声明,是在查询返回结果集以后对查询 ...

  9. YumRepo Error: All mirror URLs are not using

    yum 安装软件出错,最后发现是网络被拦截导致.

  10. CentOS 7.4 下安装 Nginx

    CentOS 7.4 下安装 Nginx 安装所需环境 Nginx 是 C语言 开发,建议在 Linux 上运行,当然,也可以安装 Windows 版本,本篇则使用 CentOS 7 作为安装环境. ...