我希望在更改selectbox的值时显示带有datepicker的文本字段。 这是我的HTML代码。
<select name="buyrent" id="buyrent" onchange="CheckRent(this.value);" />
<option value="1">Rent</option>
<option value="2">Buy</option>
</select>
<input type='text' id='start' name='start' class='fieldkecil'/>
<input type='text' id='end' name='end' class='fieldkecil'/>
这是我的javascript代码。
<script type="text/javascript">
function CheckRent(val){
var element=document.getElementById('start');
if(val=='1')
element.style.display='block';
else
element.style.display='none';
var element=document.getElementById('end');
if(val=='1')
element.style.display='block';
else
element.style.display='none';
}
</script>
而且这个。
<script>
$(document).ready(function() {
$('input.fieldkecil').Zebra_DatePicker();
});
</script>
我想要的是,当我选择'Rent'时,开始'和'结束'将用zebradatepicker显示。当我选择“购买”时,他们会隐藏。 谢谢。
答案 0 :(得分:0)
当第二个日期选择器的开始日期是第一个日期选择器的值+ 1
时,请使用此start
到end
日期选择器
function CheckRent(val){
var element=document.getElementById('start');
if(val=='1')
element.style.display='block';
else
element.style.display='none';
var element=document.getElementById('end');
if(val=='1')
element.style.display='block';
else
element.style.display='none';
}
$('#datepicker-example7-start').Zebra_DatePicker({
direction: true,
pair: $('#datepicker-example7-end')
});
$('#datepicker-example7-end').Zebra_DatePicker({
direction: 1
});
&#13;
<link rel="stylesheet" href="http://stefangabos.ro/wp-content/themes/zebra/cache/css/104fc4056ad53fbc1d0eb8dfa97c7010_6871998126.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://stefangabos.ro/wp-content/themes/zebra/cache/javascript/c3c7293f00563706bd22bc16055aad92_7122815240.js"></script>
<select name="buyrent" id="buyrent" onchange="CheckRent(this.value);" >
<option value="1">Rent</option>
<option value="2">Buy</option>
</select>
<form action="javascript:void(0)" method="post">
<div>
<span class="Zebra_DatePicker_Icon_Wrapper" id="start">
<input id="datepicker-example7-start" type="text" readonly="readonly">
</span>
<span class="Zebra_DatePicker_Icon_Wrapper" id="end">
<input id="datepicker-example7-end" type="text" readonly="readonly">
</span>
</div>
</form>
&#13;