很抱歉,如果我的问题太简单了,但我无法从jQuery UI文档中弄清楚.
如何确定在菜单中单击了哪个选项?我试过这样的东西,但它不起作用:
var menu = $('#menu');
menu.menu({
select: function(event, ui) {
alert(ui.type);
}
});?
Run Code Online (Sandbox Code Playgroud) 来自jqueryui.com的jQuery UI菜单栏git master允许键盘导航(如果它处于活动状态).
我正在寻找一种从键盘激活菜单栏的方法.我试过下面的代码.Right Alt/ AltGrkey被捕获.但是,菜单中仍会忽略箭头键.看起来应该打开第一个条形菜单键以使键盘导航生效或类似的东西.如何从键盘激活菜单,以便键盘可以使用而无需鼠标点击?
<head><script type="text/javascript">
$(function () {
$(document).bind('keyup', function (event) {
var keycode = (event.keyCode ? event.keyCode : event.which);
if (keycode === 17) { // 17 = Right ALT / AltrGR
$("#bar1").focus();
}
});
</script></head>
<body>
<div id="container">
<div id="bar1">
<% Html.RenderAction("Menu", "Home"); %>
</div>
<div id="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</div>
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
UPDATE
根据Pehmolelu的回答,它似乎应该激活菜单栏中的第一个子菜单.来自jQuery UI测试的Menubar.js代码如下.如何查找和激活第一个菜单栏,以便键盘键可用于导航?
/*
* jQuery UI menubar
*
* backported from Michael Lang's fork:
http://www.nexul.com/prototypes/toolbar/demo.html
*/
(function($) { …Run Code Online (Sandbox Code Playgroud) 嘿伙计们希望你能帮帮我...
我有点像jquery和javascript的新手.尝试实现单击对象时出现的jquery-ui菜单,但是当菜单本身以外的任何地方进行单击时会消失.
这是我到目前为止的代码
$("div.item").click(function(e){
$( "#menu" ).menu( );
$("#menu").css("top",e.pageY);
$("#menu").css("left",e.pageX);
});
Run Code Online (Sandbox Code Playgroud)
现在我想隐藏和销毁菜单,如果点击是在菜单本身以外的任何地方进行的......请提前预订.
jquery jquery-ui javascript-events onclicklistener jquery-ui-menu
我正在使用jquery-ui 1.9.2版本,其中有一个新的菜单选项.是否有任何方法可以将菜单样式更改为下拉菜单,如 http://onehackoranother.com/projects/jquery/droppy/#
我提到了 http://wiki.jqueryui.com/w/page/12137997/Menu,但这些都是插件.
我不想为此使用另一个插件,我想改变相同的jquery-ui本身,有什么办法可以做到这一点吗?
我有一个包含单字段表单的jQuery UI对话框,autoOpen属性在开头设置为false.页面上还有另一个jQuery UI菜单,对话框的open函数绑定到菜单项的click事件.我一直试图将焦点设置到对话框的唯一表单字段,当对话框打开时单击菜单项不知何故没有运气.为了查明原因,我还添加了另一个测试按钮,通过单击该按钮,我可以将焦点设置到表单域.所以我很确定这是jQuery UI菜单阻止了该领域的焦点.我想知道是否有任何办法可以绕过这种限制.任何见解都表示赞赏.谢谢!
HTML:
<ul id="menu">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
</ul>
</br>
<button id="btn">Open the dialog</button>
<div id="dialog" title="Basic dialog">
<form>
<input type="text" id="fld" />
</form>
</div>
Run Code Online (Sandbox Code Playgroud)
JavaScript的:
$( "#dialog" ).dialog({
autoOpen: false,
open: function(event, ui){
$('#fld').focus();
}
});
$('#btn').click(function(e){
$( "#dialog" ).dialog('open');
});
$('#menu li a').click(function(){
$( "#dialog" ).dialog('open');
})
$( "#menu" ).menu({
select: function( event, ui ) {
$( "#dialog" ).dialog('open');
}
});
Run Code Online (Sandbox Code Playgroud)
这是js小提琴
我在我的应用程序中使用jquery菜单。我有3个级别的子菜单。就像下面的jsfiddle中显示的那样。
http://jsfiddle.net/ankitap/WC3bE/
当我们在菜单选项上进行鼠标悬停时,子菜单将自动打开。我想禁用此功能,并且只想在单击时打开子菜单。我尝试使用:
$( "#menu a" ).menu({ role: null });
Run Code Online (Sandbox Code Playgroud)
我还尝试将1级类名作为主类,将2级类名作为子类。
<script>
$("#menu").menu();
$("#menu a").click(function() {
console.log($(this).text()); // gets text contents of clicked li
$(".subclass a").show();
});
$("#menu a").click(function() {
$(".subclass a").hide();
});
</script>
Run Code Online (Sandbox Code Playgroud)
的html代码是:
<ul id="menu" class="mainclass">
<li><a href="#">Aberdeen</a></li>
<li><a href="#">Ada</a></li>
<li><a href="#">Adamsville</a></li>
<li><a href="#">Addyston</a></li>
<li>
<a href="#">Delphi</a>
<ul class="subclass">
<li >
<a href="#">Ada</a>
<ul>
<li>
<a href="#">ankita</a>
</li>
</ul>
<li><a href="#">Saarland</a></li>
<li><a href="#">Salzburg</a></li>
</ul>
</li>
<li><a href="#">Saarland</a></li>
<li>
<a href="#">Salzburg</a>
<ul class="subclass">
<li>
<a href="#">Delphi</a>
<ul>
<li><a href="#">Ada</a></li> …Run Code Online (Sandbox Code Playgroud)