2017-07-07 70 views
-5

我想使用它的ID来禁用子页面中的主菜单项。试过“setAttribute”和“disabled”选项。如何禁用在子页面中使用JavaScript的主菜单?

document.getElementById("bloc_menu:j_id14").setAttribute("disabled","disabled"); 
document.getElementById("bloc_menu:j_id14").disabled = true; 

欢迎任何建议,谢谢你。

+0

分享您的演示与元素'bloc_menu:j_id14'这是不工作 – C2486

+0

的'disabled'属性仅适用于一对夫妇的元素,所有这些都与形式。菜单通常不是表单,所以我想知道你的实际HTML是什么样的。 – vi5ion

+0

什么类型的元素是document.getElementById(“bloc_menu:j_id14”)?我猜它不支持'disabled'财产 –

回答

0

我仍然不是100%确定你要做什么或为什么你不能处理这个服务器端,但我已经做了一个可以禁用/启用的简单菜单的例子。

var $mainMenu, $links; 
 

 
$(function() { 
 
    $mainMenu = $('#main-menu'); 
 
    $links = $mainMenu.find('.menu-item__link').each(function() { 
 
    var $link = $(this); 
 
    $link.data('href', $link.attr('href')); 
 
    }); 
 
    $('#toggle-main-menu').on('click', function() { 
 
    toggleMainMenu(); 
 
    }); 
 
}); 
 

 
function toggleMainMenu() { 
 
    if ($mainMenu.hasClass('disabled')) { 
 
    $mainMenu.removeClass('disabled'); 
 
    restoreLinks(); 
 
    } 
 
    else { 
 
    $mainMenu.addClass('disabled'); 
 
    removeLinks(); 
 
    } 
 
} 
 

 
function removeLinks() { 
 
    $links.removeAttr('href'); 
 
} 
 

 
function restoreLinks() { 
 
    $links.each(function() { 
 
    var $link = $(this); 
 
    $link.attr('href', $link.data('href')); 
 
    }); 
 
}
#main-menu .menu-item__link { 
 
    color: #000; 
 
} 
 

 
#main-menu.disabled .menu-item__link { 
 
    color: #ccc; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="main-menu"> 
 
    <li class="menu-item"> 
 
    <a class="menu-item__link" href="#someLink1">Some link 1</a> 
 
    </li> 
 
    <li class="menu-item"> 
 
    <a class="menu-item__link" href="#someLink2">Some link 2</a> 
 
    </li> 
 
    <li class="menu-item"> 
 
    <a class="menu-item__link" href="#someLink3">Some link 3</a> 
 
    </li> 
 
</ul> 
 
<button id="toggle-main-menu">Toggle the menu</button>

+0

对我来说,它是用简单的code.document.getElementById(“bloc_menu:j_id14”)。style.pointerEvents ='none'; –

+0

这只适用于鼠标事件。如果你选择你的链接并点击键盘上的Enter键,你仍然可以触发链接。 – vi5ion

+0

随着变革的重点,我们可以管理。谢谢您的意见。 –

相关问题