| 标题 | 一个JavaScript获取元素当前高度的实例 |
| 内容 | 功能预览 2html代码 <span> <tr> <td><img onclick="addType()" src="${msUrl}/images/logo/add.png">产品范围：</td> <td><select id="selectTypeOne" data-options="required:true"> <option>一级分类</option> </select> <select id="selectTypeTwo" data-options="required:true"> <option selected="selected">全部</option> </select></td> </tr> <tr height="20px"> <td></td> <td id="typeThree"></td> </tr> <tr height="30px"> <td></td> <td><span id="typeOneResult"></span><span id="typeOneSubResult"></span> <hr /></td> </tr> </span> 3js代码 $('#selectTypeOne').combobox({ url : config.urlMap.typeList, valueField : 'name', textField : 'name', required : true, width : '100', onSelect : function(row) { typeName1 = row.name $('#typeThree').html(""); $('#typeOneResult').html(""); $('#typeOneSubResult').html(""); subTypeName=[]; $('#selectTypeTwo').combobox({ url : config.urlMap.typeList + "?parent=" + row.id, valueField : 'name', textField : 'name', width : '100', required : true, onSelect : function(row) { typeName2 = typeName1 + ">" + row.name; $.getJSON(config.urlMap.typeList + "?parent=" + row.id, function(data) { var typeThreeName = "" for (var i = 0; i < data.length; i++) { typeThreeName += "<input onclick=clinkType("" + data[i].name + "") name='typeThree' value=" + data[i].name + " type='checkbox'>" + data[i].name } $('#typeThree').html(typeThreeName); $('#typeOneResult').html(typeName2 + ">"); $('#typeOneSubResult').html(""); subTypeName=[]; }); } }) } }); }) //删除下标元素方式一 Array.prototype.remove = function(dx) { if (isNaN(dx) || dx > this.length) { return false; } for (var i = 0, n = 0; i < this.length; i++) { if (this[i] != this[dx]) { this[n++] = this[i] } } this.length -= 1 } //删除数组元素方式二 Array.prototype.baoremove = function(dx) { if (isNaN(dx) || dx > this.length) { return false; } this.splice(dx, 1); } <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-获取元素当前高度</title> <style> #date{width:90%;height:25%;padding:10px;background: red;} </style> <script> window.onload = function(){ var height = getHeight(); console.log(height); } function getHeight(){ var height = 0; var div = document.getElementById("date").getBoundingClientRect(); if(div.height){ height = div.height; }else{ height = div.bottom - div.top; } return height; } </script> </head> <body> <div> <div id = "date"> </div> </div> </body> </html> var subTypeName = []; function clinkType(name) { var index = subTypeName.indexOf(name) if (index == -1) { subTypeName.push(name); } else { subTypeName.baoremove(index); } $('#typeOneSubResult').html(subTypeName.join(",")); } |
| 随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。