Сочетание клавиш jQuery с помощью clickkevent

Я хотел бы иметь кнопку на моем сайте, которая имитирует CTRL + + (увеличение). Поэтому мне нужно создать 2 нажатия клавиш или что-то. У меня есть следующее, которое запускает 1 нажатие клавиши:

<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    <title>Stackru</title>
</head>
<body>
<script type="text/javascript">
    function simulateKeyPress(character) {
        jQuery.event.trigger({ type: 'keypress', which: character.charCodeAt(0) });
    }

    function pressCtrlPlus() {
        simulateKeyPress("=");
    }

    $(function () {
        $('body').keypress(function (e) {
            alert(e.which);
        });
    });
</script>

<input type="button" value="Ctrl +" ONCLICK="pressCtrlPlus();">

</body>
</html>

Кто-нибудь знает, как создать событие CTRL + +, нажав на кнопку?

2 ответа

В соответствии с этой темой SO: При вызове keyevent от мыши я создал следующий тест:

<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    <title>Stackru</title>
</head>
<body>
<script type="text/javascript">
    function zoomin(zlevel) {
        var _body = parent.parent.document.body;

        if (jQuery.browser.msie) {
            _body.style.zoom = zlevel;              
        }
        else
        {
            if (typeof _body.style.MozTransform == "string")    
                _body.style.MozTransform = "scale(" + (zlevel) + ")";
            else if (typeof _body.style.zoom == "string")
                _body.style.zoom = (zlevel*100) + "%";              
        }
    }
</script>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

<input type="button" value="Ctrl0" ONCLICK="zoomin(1.0);">
<input type="button" value="Ctrl+" ONCLICK="zoomin(1.15);">
<input type="button"  value="Ctrl++" ONCLICK="zoomin(1.3);">
</body>
</html>

Но это все еще действует странно. Я еще не видел никакого решения, которое работает как масштабирование с помощью сочетания клавиш CTRL + +. Разве это не может быть сделано?

Чтобы сохранить функционирование zoomin, вам нужно запомнить текущий уровень масштабирования.

<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
    <title>Stackru</title>
</head>
<body>
<script type="text/javascript">
    function zoomin(zlevel) {
        zlevel = $('#zlevel').val() * zlevel;
        $('#zlevel').val(zlevel);

        var _body = parent.parent.document.body;

        if (jQuery.browser.msie) {
            _body.style.zoom = zlevel;              
        }
        else
        {
            if (typeof _body.style.MozTransform == "string")    
                _body.style.MozTransform = "scale(" + (zlevel) + ")";
            else if (typeof _body.style.zoom == "string")
                _body.style.zoom = (zlevel*100) + "%";              
        }
    }
</script>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

<input type="button" value="Ctrl0" ONCLICK="zoomin(0.9);">
<input type="button" value="Ctrl+" ONCLICK="zoomin(1.15);">
<input type="button"  value="Ctrl++" ONCLICK="zoomin(1.3);">
<input type="hidden" value="1" id="zlevel">
</body>
</html>
Другие вопросы по тегам