例:一個系統分爲管理員登陸和用戶登陸,不一樣的身份顯示不一樣的頁面和加載操做不一樣的數據庫,登陸前須要點擊單選框指明登錄者身份。
jquery
1 <input type="radio" name="identity" value="0">管理員</br> 2 <input type="radio" name="identity" value="1">用戶</br>
判斷哪一個選中能夠使用僞類數據庫
document.querySelector("[name='identity']:checked").value
或者使用jquery $("[name='identity']:checked").val()
這樣就能夠經過返回的0或1判斷身份。app
h5頁面點擊放大:思路使用經過fixed定位的元素當遮罩層,而後將放大的圖片放在遮罩層上面。點擊遮罩層,遮罩層消失。ide
首先給遮罩層設置寬高和定位this
1 div.click-enlarge { 2 position: fixed; 3 top: 0; 4 left: 0; 5 z-index: 9999; 6 background-color: rgba(0, 0, 0, 0.8); 7 display: none; 8 }
而後編輯js邏輯spa
1 var imgs = document.querySelectorAll("img"); //獲取點擊須要方法的圖片 2 var enlarge = document.querySelector(".click-enlarge"); //獲取遮罩層容器 3 var clienthight = document.documentElement.clientHeight; //獲取屏幕的寬高 4 var clientwidth = document.documentElement.clientWidth; 5 enlarge.style.width = clientwidth + 'px'; //使遮罩層鋪滿屏幕 6 enlarge.style.height = clienthight + 'px'; 7 imgs.forEach(function(v, i) { //循環獲取的圖片並綁定點擊事件 8 imgs[i].onclick = function() { 9 enlarge.style.display = "block"; 10 var imgsrc = v.src; 11 var newimg = document.createElement("img"); 12 newimg.src = imgsrc; 13 newimg.style.width = '100%'; 14 newimg.style.position = "absolute"; 15 newimg.style.top = '30%'; 16 enlarge.innerHTML = ""; 17 enlarge.appendChild(newimg); 18 } 19 }); 20 enlarge.onclick = function() { 21 this.style.display = "none"; 22 };
我的總結筆記,不是最好倒是實踐,有誤請指正,謝謝!code