combobox添加下拉内容_开发记录篇前端内容1

        有段时间没有更新文章了，因为是用的公司电脑，没有虚拟机，所以就没法演示hadoop相关的东西了，而且大数据篇的东西需要花费一些时间和精力去收集整理内容，那大数据篇就先暂停一下。最近这段时间的话我可能会更新一些开发记录的东西，就相当于我自己工作或学习中的笔记吧，比如有面试相关的知识点、前端相关的、后端框架相关的以及数据库知识点等等。

        本篇的话就先从前端的内容开始吧，你们可能没注意到，前边我分享的所有内容都是后端的内容，没有任何前端的东西，说实话前端的知识也是我的一个弱项，所以我经常会整理一些我搞不太懂的一些前端知识，可能有一些比较傻的比较简单的也整理了，大家不感兴趣的话可以直接划走了，哈哈。

1、这个是通过iframe嵌套自己的一套菜单，菜单的相关项是对应的后台代码到其他系统动态获取的菜单项数据，然后返回到页面上。

//改为调用自己拼接的菜单获取方法<iframe id="caidan" width="100%" frameborder="0" scrolling=yes style="overflow-x:hidden;scrollbar-arrow-color:rgb(230,51,10);background-color:#e7340c;"src="${ctx}/saaUser/showMenu.do?systemCode=csm&userCode=${userInfo.userCode}" id="left" name="left" height="554">iframe>

2、将form表单中的项置为不可变后(disabled)提交form表单时，该项不会传至后台，所以在提交form表单之前，可以先将disabled属性移除，再提交form表单。然后提交完后可以再添加disabled属性。

//移除属性document.getElementById("secondComCode_1").removeAttribute("disabled");// 或者使用jquery将所有设置的disabled属性全部清空$(":disabled").removeAttr("disabled");//添加disabled属性var qjflag = get("qjflag");qjflag[0].selected='selected';qjflag.disabled='disabled';

3、jsp页面上获取后台数据：

var insurerCode = '';var comLevel = '${session.companyInfoVo.company1.comLevel}';

4、多选框的全选和反选

//全选  function checkAll() {    var objCheck = document.getElementsByName("transactCom");    for (var i = 0; i < objCheck.length; i++) {      objCheck[i].checked = true;    }  }  //反选  function checkReverse() {    var objCheck = document.getElementsByName("transactCom");    for (var i = 0; i < objCheck.length; i++) {      objCheck[i].checked = !objCheck[i].checked;    }}

5、获取单选框的选中值

//获取单选框的选中值 var val=$('input:radio[name="queryDate"]:checked').val();

6、下拉框取值问题

// 取被选中的值方法1var policyState = document.getElementById("policyState").value;// 取被选中的值方法2//先获取当前选择项的索引.再获取当前选择项的值var index=document.getElementById("AreaId").selectedIndex;document.getElementById("AreaId").options[index].value;// 取被选中的值方法3//循环遍历判断哪个被选中了 然后获取选中的值var obj=document.getElementById("AreaId");   for(i=0;i//下拉框的长度就是它的选项数.      if(obj[i].selected==true) {          var text=obj[i].value;//获取当前选择项的值.　　　　}　  }// 取被选中的值方法4　  $("#projecttype").find("option:selected").val();// 取被选中的值方法5$("#projecttype option:selected").val();　  //　取value为0的选项的文本值  $('#projecttype option[value = "0"]').text()；  //获取被选中的选项的属性emoney的值var iteValue = $("#ddl").find("option:selected").attr("emoney");

7、判断多选框是否被选中

function isCheckBoxNull(field){    var flag = false;    for(var i=0;i      if(field[i].checked){        flag = true;        break;      }    }    return flag; }

8、js创建数组的三种方法

//创建数组的第一种方法int[] arr=new int[6];//创建数组的第二种方法int[] x={1,2,3,4};//创建数组的第三种方法。int[] y= new int[]{1,2,3,4,5};

9、动态添加下拉框的选项

document.getElementById("businessType").options.add(new Option("综合拓展","02"));

10、ajax调用后台

$.ajax({    //请求方式     type: "post",      // 请求地址     url: "${ctx}/automation/querySubordinate.do",     // 请求参数    data: {"comCode": comCode,"compCode":compCode,"comLevel":comLevel},    // 返回的数据格式    dataType : "json",    // false同步请求、true异步请求    async : false,    //成功回调方法     success: function (data) {    //前台页面使用的yahoo的框架 很老的          var result = YAHOO.lang.JSON.parse(data);            for (var i = 0; i < result.data.length; i++) {              comCodeSelect.append("" + result.data[i].comCname.replace("*","") + "");            }        },     //失败回调方法        error: function () {            alert("加载失败");        }});

11、js定时器操作

//注册定时器 timeid = window.setInterval(scanDownload, 5000);// 清除定时器window.clearInterval(timeid); // 注册带有参数的定时器timeid = window.setInterval(_scanDownload(flagNum), 5000);/***由于定时器只能执行不带参数的方法，所以使用另一函数包装一次目标函数，可实现定时执行带参数的函数*/function _scanDownload (flagNum){  return function(){    scanDownload(flagNum);   }}

12、动态加载后台获取的下拉框内容渲染到页面上

"display: none" id="company1"> <c:forEach items="${proCompany1}" var="company"> <option value="${company.id.comCode}">${fn:replace(company.comCname,"自治区","")}option> c:forEach>div>//获取下拉框var secondComCode = $("#secondComCode_1");//清空下拉框中的内容secondComCode.empty();//获取div中的内容var s = $("#company1").html();//将div中的内容添加到下拉框中secondComCode.append(s);

13、注册与取消onchange事件

//注册onchange事件secondComCode.change(function() {  queryComCodeNew(this,compname);});//取消onchange事件secondComCode.unbind("change");

14、文字格式与反格式化

/***  将任务说明中的空格、回车等特殊字符进行转换入库，以便在页面展示时格式化*/  function changeTaskStatement(){    var taskStatement = document.getElementById("taskStatement").value;      //将页面输入内容转换格式    var des = taskStatement.replace(/\r\n/g, '
').replace(/\n/g, '
').replace(/\s/g, '&nbsp');        $("#taskStatementHide").val(des);  }/***  加载页面时，进行文字内容反转换*/  function univerTaskStatement(){    var taskStatement = document.getElementById("taskStatement").value;      var re1 = /(
|
|
|
)/g;      var re2 = /(\&nbsp)/g;      //将数据库加载内容内容转换格式    var des = taskStatement.replace(re1,"\n").replace(re2,"\s");        //将转换后的内容赋给多行文本框       document.getElementById("taskStatement").value = des;  }

15、设置刷新自动加载事件间隔时间

// 设置刷新自动加载的事件间隔为 5 秒 response.setIntHeader("Refresh", 5);

        ok，今天就暂时整理这些吧，后续还会继续更新整理相关的内容...