jquery.style.display實現顯示隱藏+時間選擇效果
1、http://www.my97.net/dp/demo/index.htm
一個很好的時間控制元件，可以下載其js檔案，用在開發中非常好用
選擇日期從當天開始，第二個框只能選擇第一個框中選擇日期後的兩個月內的日期
<th style="font-size: 14px">有效時間:</th>
<td colspan="3">
<input id="timeStart" class="Wdate" type="text" onFocus="WdatePicker({minDate:'%y-%M-%d'})" name="timeStart" />
- <input id="timeEnd" name="timeEnd" class="Wdate" type="text" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'timeStart\')}',maxDate:'#F{$dp.$D(\'timeStart\',{M:2})}'})"/>
</td>
<td></td><td colspan="2">
<input id="timeStart" class="Wdate" style="width:100px" type="text" onFocus="WdatePicker({minDate:'%y-%M-%d'})" name="timeStart" value='<s:date name="startTime" format="yyyy-MM-dd"/>'/>
- <input id="timeEnd" name="timeEnd" class="Wdate" style="width:100px" type="text" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'timeStart\')}',maxDate:'#F{$dp.$D(\'timeStart\',{M:2})}'})" value='<s:property value="endTime"/>'/>
</td>
2、時間顯示處理
<span class="indate">有效期：
<s:date name="(startTime.before(endTime))?startTime:endTime" format="yyyy-MM-dd" />
至<s:date name="(startTime.before(endTime))?endTime:startTime" format="yyyy-MM-dd"/>
</span>
3、jquery實現顯示隱藏
$("#id").css('display','none');
$("#id").css('display','block');
或
$("#id")[0].style.display = 'none';
$("#id")返回的是JQuery
它是個集合肯定有display屬性
$("#id").show()表示display:block, $("#id").hide()表示display:none; $("#id").toggle()切換元素的可見狀態。如果元素是可見的，切換為隱藏的；如果元素是隱藏的，切換為可見的。
2、javascript實現顯示隱藏
<script>
function chg(){
if(document.getElementById("sel").value=="txt"){
document.getElementById("txt").style.display="";
document.getElementById("btn").style.display="none";
}else{
document.getElementById("txt").style.display="none";
document.getElementById("btn").style.display="";
}
}
</script>
<html><head></head><body>
<select id="sel" onChange="chg()">
<option value="txt">txt</option>
<option value="btn">btn</option>
</select>
<input type="text" name="txt" id="txt" style="display:none">
<input type="button" name="btn" value="btn" id="btn" style="display:none">
</body>
</html>