js控制TR的顯示隱藏
更新時間：2016年03月04日 17:14:00 作者：CangoWu
在很多現(xiàn)實的場景中，有的文本框我們希望在選擇“是”的按鈕之后才出現(xiàn)，這就需要js控制TR的隱藏和顯示，如何控制，本文為大家揭曉
下文分享的一段代碼：選擇是的按鈕就顯示身高和體重的文本框的代碼。注意：ready方法必須要引用jquery的庫。
1.html Code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<style type="text/css">
.div1{ width:300px; height:80px; border:1px solid green;}
.div2{ width:300px; height:80px; border:1px solid red;}
</style>
<SCRIPT language=javascript type=text/javascript src="jquery-1.7.2.min.js"></SCRIPT>
<script type="text/javascript">
function setDetailMsgRow(rowID,sel) {
var row = document.getElementById(rowID);
if (row != null) {
if (sel.value == 1) {
row.style.display = "block";
}
else {
row.style.display = "none";
}
}
}
/*自動加載隱藏框,ready方法必須要引用jquery的庫*/
$(document).ready(function(){
var sel = document.getElementById('selID');
setDetailMsgRow('show',sel);
});
function onload() {var sel = document.getElementById('selID');
setDetailMsgRow('show',sel);
}
</script>
</head>
<body>
<TABLE border="1" cellpadding="2" cellspacing="0">
<TBODY>
<TR>
<TD>是否填寫身高體重</TD>
<TD><SELECT width='100%' id=selID onchange = "setDetailMsgRow('show',this)">
<OPTION value="1" selected>是</OPTION>
<OPTION value="0">否</OPTION>
<OPTION ></OPTION>
</SELECT>
</TD><TD></TD><TD></TD></TR>
<TR id=show style="display:none;">
<TD>身高</TD>
<TD><INPUT id=Height></TD>
<TD>體重</TD>
<TD><INPUT id=Weight></TD></TR>
</TBODY>
</TABLE>
</body>
</html>
網(wǎng)上可以下載jquery-1.7.2.min.js將其引入。
2.效果
以上就是本文的全部內(nèi)容，希望對大家學習javascript程序設計有所幫助。
相關文章
要捕獲JavaScript代碼中的異常一般會采用 try catch，不過try catch的使用是否是對代碼性能產(chǎn)生影響呢？答案是肯定有的，但是有多少不得而知。下面這篇文章就給大家詳細介紹了在JS中用try catch對代碼運行的性能影響，有需要的朋友們可以參考借鑒。2016-12-12
下面小編就為大家?guī)硪黄猻so跨域寫cookie的一段js腳本(推薦)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
這篇文章主要介紹了詳細教你微信公眾號正文頁SVG交互開發(fā)技巧，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-07-07
一款十分簡單的原生js實現(xiàn)的隨機點菜代碼，點擊點菜按鈕隨機點取上面菜單的菜品，可根據(jù)需求改成自己需要功能，比如說隨機點名。感興趣的朋友來參考實現(xiàn)代碼吧2019-12-12
javascript的offset、client、scroll使用方法詳解
javascript的offset、client、scroll在使用過程中非常頻繁，接下來將對此進行一一介紹，需要了解的朋友可以詳細參考下2012-12-12
location是javascript里邊管理地址欄的內(nèi)置對象，比如location.href就管理頁面的url，用location.href=url就可以直接將頁面重定向url。而location.hash則可以用來獲取或設置頁面的標簽值。2010-03-03
這篇文章主要介紹了Select下拉框模糊查詢功能實現(xiàn)代碼的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-07-07
本篇文章主要介紹了Webpack實戰(zhàn)加載SVG的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-12-12
這篇文章主要介紹了利用cookies設置每隔24小時彈出框的實例代碼,需要的朋友可以參考下2017-04-04
解決微信授權成功后點擊按返回鍵出現(xiàn)空白頁和報錯的問題
這篇文章主要介紹了解決微信授權成功后點擊按返回鍵出現(xiàn)空白頁和報錯的問題，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-06-06