Javascript 选择列表在jQuery中的选项悬停时关闭悬停时显示/隐藏Div
我通过jQuery设置了一个div,以在项目悬停时显示和隐藏。在div中我有下拉列表,但是当我单击选择列表并将鼠标悬停在选项列表上时,选择菜单立即关闭 jQuery:Javascript 选择列表在jQuery中的选项悬停时关闭悬停时显示/隐藏Div,javascript,jquery,html,css,list,Javascript,Jquery,Html,Css,List,我通过jQuery设置了一个div,以在项目悬停时显示和隐藏。在div中我有下拉列表,但是当我单击选择列表并将鼠标悬停在选项列表上时,选择菜单立即关闭 jQuery: <script type='text/javascript'>//<![CDATA[ $(window).load(function(){ $(".tiptext").mouseover(function() { $(this).children
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$(".tiptext").mouseover(function() {
$(this).children(".description").show();
}).mouseout(function() {
$(this).children(".description").hide();
});
});//]]>
</script>
//
HTML:
日历使用
可用日期以白色标记,不可用日期以黑色标记。度假别墅在抵达当天下午4:00开始提供,需要在出发当天上午10:00前腾空。如果您有更早的航班到达时间,请直接与我们联系
检查可用性
到达日期
代蒙梯
1月至2月至4月5日6月至9月10日十月至12月1234567891011213141516171819202122232425262728293031
2013
2014
夜数
入住时间:7晚
东部标准时间。比率
有人对如何解决这个问题提出了建议吗?使用
mouseenter
和mouseleave
而不是mouseover
和mouseout
如果用户将鼠标移到嵌套在给定元素中的元素上或移出该元素,则针对给定元素触发mouseover和mouseout事件
如果您想了解这两种方法之间的差异,请使用
mouseenter
和mouseleave
而不是mouseover
和mouseout
如果用户将鼠标移到嵌套在给定元素中的元素上或移出该元素,则针对给定元素触发mouseover和mouseout事件
如果你想知道这两者之间的区别,这将很有帮助。尽管我使用了mouseenter和mouseleave,但这个问题在IE8上还是会再次出现。这个问题在IE8上再次出现,尽管我使用了mouseenter和mouseleave。有什么解决办法吗?
<div class="description" style="display: none;">
<div id="tab1">
<h2>Calendar Use</h2>
<p>Available dates are marked in white, those unavailable are black. The holiday villa is available from 4:00pm on the day of arrival and needs to be vacated by 10:00am on the day of departure. If you have earlier flight arrival times kindly contact us directly.</p>
</div>
<div id="tab2">
<h2>Check Availability</h2>
<br><p>Arrival Date</p>
<div id="calendar-titles"><span class="day-t">day</span><span class="month-t">month</span><span class="year-t">year</span></div>
<form method="post" action="">
<div id="calendar-container"><select id="year2Sel" name="year2Sel" onchange="showRSS(document.getElementById('field2').value"></select><select id="monthSel" name="monthSel" onclick="showRSS(document.getElementById('field2').value, document.getElementById('yearSel').value, this.value, document.getElementById('daySel').value )"><option value="0">January</option><option value="1">February</option><option value="2">March</option><option value="3">April</option><option value="4">May</option><option value="5">June</option><option value="6">July</option><option value="7">August</option><option value="8">September</option><option value="9">October</option><option value="10">November</option><option value="11">December</option></select><select id="daySel" name="daySel" onchange="showRSS(document.getElementById('field2').value, document.getElementById('yearSel').value, document.getElementById('monthSel').value, this.value )"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option></select></div>
<select id="yearSel" name="yearSel" onchange="showRSS(document.getElementById('field2').value, document.getElementById('yearSel').value, document.getElementById('monthSel').value, document.getElementById('daySel').value)">
<option value="2013">2013</option>
<option value="2014">2014</option>
</select>
<div id="avail-left">
<p>No of Nights</p>
<span>min stay: 7 nights</span>
<input type="text" id="field2" name="nights" onkeyup="showRSS(this.value, document.getElementById('yearSel').value, document.getElementById('monthSel').value, document.getElementById('daySel').value)" value="" alt="Test" onkeypress="return isNumberKey(event)" onchange="isValid();">
</div>
<div id="avail-right">
<p>Est. Rate</p>
<div id="rssOutput"></div></div>
<input type="submit" value="Enquire" name="submit" class="enquirebtn">
</form>
<br>
</div>
<div id="tab3">
<iframe width="243px" height="221px" src="/calendar/index.php" frameborder="0" border="0" style="border:0px;"></iframe>
</div>
</div>
$(".tiptext").mouseenter(function() {
$(this).children(".description").show();
}).mouseleave(function() {
$(this).children(".description").hide();
});