我有多个 DIV，每个 DIV 包含一个活动传单。将鼠标悬停后，我想显示事件名称和详细信息，并能够单击事件列表。这适用于第一个列出的事件，但不适用于以下任何事件。我有以下Javascript代码和DIV结构，如下所述。该页面位于 http://midnightguru.com/events_concept.php 以供参考。
<script type="text/javascript">
$(document).ready(function() {
$("#event_main").mouseenter(function() {
$("#event_hover").show();
}).mouseleave(function() {
$("#event_hover").hide();
});
});
</script>
<div id="event_main"></div><div id="event_hover"></div>
任何帮助不胜感激！我努力寻找，无法弄清楚！
嗯，
首先，ID 属性必须用于标识对象的单个实例。
因此，相反，请为div 元素使用一个类并执行以下操作：
$('.event_main').mouseenter(function(){
$(this).find('.event_hover').show();
}).mouseleave(function(){
$(this).find('.event_hover').hide();
});
});
<div class='event_main'>
...
<div class="event_hover" style="display: none;">
...
</div>
</div>
编辑：另外，将该脚本放在$（document）.ready上，对于所有页面只有一次，好吗？
GL
它正在处理匹配的第一个项目，因为 jQuery 选择器
$（"#event_main"）
实际上只匹配您的第一个事件div，即使它们的 id 都为 event_main 。
# 选择器将仅匹配单个元素：http://api.jquery.com/id-selector/
你需要使用其他一些jQuery选择器来匹配元素，因为所有这些div的id都是event_main。 （也许您的意图是使用 event_main 作为divs 的类，然后使用 .event_main 作为选择器？