jQuery UI布局 - 隐藏/显示窗格上的功能

时间:2014-02-06 19:02:06

标签: jquery jquery-ui-layout

我正在尝试在切换窗格时触发一个功能。

enter image description here

我无法找到一种方法来“聆听”这些小按钮的点击方法(图片的红色圆圈)。这就是我在西方按钮上尝试的内容:

$('.ui-layout-toggler.ui-layout-toggler-west.ui-layout-toggler-open.ui-layout-toggler-west-open').click(function(){
    alert('test');
});

但是当我点击它时,我的警报不会弹出(但是窗格会隐藏/显示)。使用F12我有这个html:

<div id="" class="ui-layout-toggler ui-layout-toggler-west ui-layout-toggler-open ui-layout-toggler-west-open" title="Fechar" style="position: absolute; display: block; padding: 0px; margin: 0px; overflow: hidden; text-align: center; font-size: 1px; cursor: pointer; z-index: 1; visibility: visible; height: 48px; width: 6px; top: 174px; left: 0px;"></div>

1 个答案:

答案 0 :(得分:1)

尝试:

$('body').on('mousedown', '.ui-layout-toggler', function(){
    console.log('test');
});

似乎还有另一个事件处理程序要么干扰/优先,要么甚至可能使用导致event.stopPropagation()不能工作的on.('click')。解决这个问题的一种方法是捕获mousedown事件,这应该适用于用户点击切换按钮后要执行的任何操作....

捕捉箭头+ ctrl键使用此代码:

        var arrow = {
            left: 37,
            up: 38,
            right: 39,
            down: 40
           },

        ctrl = 17;

        $(document).on("keydown", function (event) {
            if (event.ctrlKey && event.which === arrow.left) {
                console.log("You pressed left, and control.");
            }
        });

我从这篇SO帖子中得到了这段代码:How to do something if the user presses two keys in javascript

这是新的小提琴:http://jsfiddle.net/zUrpz/4/