我有一个社交引擎网站。有一个链接“更新”。这将弹出基于ajax的结果鼠标结束事件。如果我们再次指向“更新”链接它将关闭弹出窗口。这一切都正常。当我放置mouseout事件时这里mouseout事件没有正常工作,它也会触发事件也让鼠标结束。这是我的代码
<ul>
<?php if( $this->viewer->getIdentity()) :?>
<li id='core_menu_mini_menu_update' >
<span style="display: inline-block;" class="updates_pulldown" id="update_list" >
<div class="pulldown_contents_wrapper" onmouseout="toggleUpdatesPulldownOut(event, this, '4');">
<div class="pulldown_contents" >
<ul class="notifications_menu" id="notifications_menu" >
<div class="notifications_loading" id="notifications_loading">
<img src='<?php echo $this->layout()->staticBaseUrl ?>application/modules/Core/externals/images/loading.gif' style='float:left; margin-right: 5px;' />
<?php echo $this->translate("Loading ...") ?>
</div>
</ul>
</div>
<div class="pulldown_options" >
<?php echo $this->htmlLink(array('route' => 'default', 'module' => 'activity', 'controller' => 'notifications'),
$this->translate('View All Updates'),
array('id' => 'notifications_viewall_link')) ?>
<?php echo $this->htmlLink('javascript:void(0);', $this->translate('Mark All Read'), array(
'id' => 'notifications_markread_link',
)) ?>
</div>
</div>
<a onmouseover="toggleUpdatesPulldown(event, this, '4');" href="javascript:void(0);" id="updates_toggle" <?php if( $this->notificationCount ):?> class="new_updates"<?php endif;?>><?php echo $this->translate(array('%s Update', '%s Updates', $this->notificationCount), $this->locale()->toNumber($this->notificationCount)) ?></a>
</span>
</li>
<?php endif; ?>
<?php foreach( $this->navigation as $item ): ?>
<li><?php echo $this->htmlLink($item->getHref(), $this->translate($item->getLabel()), array_filter(array(
'class' => ( !empty($item->class) ? $item->class : null ),
'alt' => ( !empty($item->alt) ? $item->alt : null ),
'target' => ( !empty($item->target) ? $item->target : null ),
))) ?></li>
<?php endforeach; ?>
<?php if($this->search_check):?>
<li id="global_search_form_container">
<form id="global_search_form" action="<?php echo $this->url(array('controller' => 'search'), 'default', true) ?>" method="get">
<input type='text' class='text suggested' name='query' id='global_search_field' size='20' maxlength='100' alt='<?php echo $this->translate('Search') ?>' />
<button type="submit" id="submit_search" class="searchbutton" name="submit"></button>
</form>
</li>
<?php endif;?>
</ul>
<script>
var toggleUpdatesPulldownOut = function(event, element, user_id) {
document.getElementById("update_list").className='updates_pulldown';
}
var toggleUpdatesPulldown = function(event, element, user_id) {
setTimeout(continueExecution, 300);
}
function continueExecution(){
if( document.getElementById("update_list").className=='updates_pulldown' ) {
document.getElementById("update_list").className= 'updates_pulldown_active';
showNotifications();
}
else if( document.getElementById("update_list").className=='updates_pulldown_active' ){
document.getElementById("update_list").className='updates_pulldown';
}
}
var showNotifications = function() {
en4.activity.updateNotifications();
new Request.HTML({
'url' : en4.core.baseUrl + 'activity/notifications/pulldown',
'data' : {
'format' : 'html',
'page' : 1
},
'onComplete' : function(responseTree, responseElements, responseHTML, responseJavaScript) {
if( responseHTML ) {
// hide loading icon
if($('notifications_loading')) $('notifications_loading').setStyle('display', 'none');
$('notifications_menu').innerHTML = responseHTML;
$('notifications_menu').addEvent('click', function(event){
event.stop(); //Prevents the browser from following the link.
var current_link = event.target;
var notification_li = $(current_link).getParent('li');
// if this is true, then the user clicked on the li element itself
if( notification_li.id == 'core_menu_mini_menu_update' ) {
notification_li = current_link;
}
var forward_link;
if( current_link.get('href') ) {
forward_link = current_link.get('href');
} else{
forward_link = $(current_link).getElements('a:last-child').get('href');
}
if( notification_li.get('class') == 'notifications_unread' ){
notification_li.removeClass('notifications_unread');
en4.core.request.send(new Request.JSON({
url : en4.core.baseUrl + 'activity/notifications/markread',
data : {
format : 'json',
'actionid' : notification_li.get('value')
},
onSuccess : function() {
window.location = forward_link;
}
}));
} else {
window.location = forward_link;
}
});
} else {
$('notifications_loading').innerHTML = '<?php echo $this->string()->escapeJavascript($this->translate("You have no new updates."));?>';
}
}
}).send();
};
</script>