JQuery顯示隱藏DIV的方法及代碼實例
1. 如果在載入是隱藏：
<head>
<script language="javascript">
function HideWeekMonth()
{
$("#tt1").hide();
$("#tt2").hide();
}
</script>
</head>
<body onLoad="HideWeekMonth()">
</body>
2. 動態(tài)隱藏和顯示：
<td>
<!-- 能用
<input id="btnShow" type="button" value="<?php echo $ini_array['module.insert'];?>" class="btn" />
<input id="btnHide" type="button" value="<?php echo $ini_array['module.insert'];?>" class="btn" />
-->
<!-- 直接使用按鈕的id沒有問題
<input id="tt" type="text" name="title" maxlength="50" size="50"></td> -->
<input id="btnOne" type="radio" name="frequence" value="1" checked='checked'><?php echo $ini_array['time.one']?>
<input id="btnDay" type="radio" name="frequence" value="2"><?php echo $ini_array['time.day']?>
<input id="btnWeek" type="radio" name="frequence" value="3"><?php echo $ini_array['time.week']?>
<input id="btnMonth" type="radio" name="frequence" value="4"><?php echo $ini_array['time.month']?>
<br>
<!-- 能用
<div id="tt1"><input type="text" name="title" maxlength="50" size="50" value="tt1"></div>
<div id="tt2"><input type="text" name="title" maxlength="50" size="50" value="tt2"></div>
-->
<div id="tt1">
<br>
1 <input type="checkbox" value="1" name="w1">
2 <input type="checkbox" value="1" name="w2"> </div>
<div id="tt2">
03 <input type="checkbox" name="m3">
04 <input type="checkbox" name="m4"> </div>
</td>
<!-- 綁定事件似乎要寫在被綁定對象的后面 -->
<script type="text/javascript" >
$("#btnOne").bind("click", function(event) { $("#tt1").hide(); $("#tt2").hide(); });
$("#btnDay").bind("click", function(event) { $("#tt1").hide(); $("#tt2").hide(); });
$("#btnWeek").bind("click", function(event) { $("#tt1").show(); $("#tt2").hide(); });
$("#btnMonth").bind("click", function(event) { $("#tt1").hide(); $("#tt2").show(); });
</script>
以上代碼之前，可能還要加上這句話：
<script type="text/javascript" src="../../scripts/jquery.min.js"></script>
使用jquery真的很方便，比如要控制div的顯示與隱藏，一句話就搞定了，請看下面使用說明。
$("#id").show()表示display:block,
$("#id").hide()表示display:none;
$("#id").toggle()切換元素的可見狀態(tài)。如果元素是可見的，切換為隱藏的；如果元素是隱藏的，切換為可見的。
$("#id").css('display','none');
$("#id").css('display','block');
或
$("#id")[0].style.display = 'none';
相關文章
jQuery對Ajax操作進行了封裝，在jQuery中$.ajax()方法屬于最底層的方法，第2層是laod()、$.get()和$.post()方法，第3層是$.getScript()和$.getJSON()方法。2009-10-10
這篇文章主要介紹了用jquery來定位2007-02-02
本文給大家分享一段代碼給大家介紹jquery刪除當前節(jié)點元素的方法，代碼簡單易懂，非常不錯，需要的朋友參考下吧2016-12-12
jQuery的ajax方法非常好用，這么好的東西，你想擁有一個屬于自己的ajax么？接下來，我們來自己做一個簡單的ajax吧2017-01-01
這篇文章主要為大家詳細介紹了jquery實現全選功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
AJAX實現瀑布流觸發(fā)分頁與分頁觸發(fā)瀑布流的方法
瀑布流觸發(fā)分頁可以理解為微博中的瀏覽效果、到一定程度時顯示頁數進行分頁,而分頁觸發(fā)瀑布流可以理解為Twitter拉到一頁設定的最大條數后繼續(xù)用瀑布流展示下一頁,接下來我們就來詳細看看AJAX實現瀑布流觸發(fā)分頁與分頁觸發(fā)瀑布流的方法2016-05-05
動態(tài)表格,功能為點擊添加按鈕，表格增加一行并給其name屬性賦予的值，點擊刪除，自動刪除這一行，具體實現如下2014-08-08
這篇文章主要介紹了jQuery實現獲取當前鼠標位置并輸出功能,涉及jQuery事件響應及頁面元素屬性動態(tài)操作相關實現技巧,需要的朋友可以參考下2019-01-01
這篇文章主要介紹了jquery顯示loading圖片直到網頁加載完成的方法,涉及jquery頁面加載與動畫效果的使用技巧,需要的朋友可以參考下2015-06-06
初探jquery——表單應用范例...2007-02-02