плагин keynav jquery не работает - PullRequest
1 голос
/ 22 мая 2011

Я не могу переместить выделитель div на (любой) веб-странице, перемещение которой включено только с помощью 4 клавиш со стрелками (и пятой клавиши (с кодом клавиши 13)). Я ничего не знаю о том, чтопятый ключ и его назначение.Я использую плагин keynav для этой цели и дополнительный код для вставки в него подсветки, но все напрасно

1 Ответ

1 голос
/ 22 мая 2011

Если вы используете плагин jquery.keynav , то он работает просто отлично, даже с последней версией jQuery (v1.6.1).В вычислениях ASCII - это схема кодировки символов, а 13 - это номер клавиши (Enter) (см. Управляющие символы ASCII ).

Плагин jQuery предназначен для клавиш со стрелками для перемещения поля выбора и ключ для запуска события .click().

Вот демонстрационная программа, использующая плагин.Вам нужно будет сохранить код плагина как jquery.keynav.js и поместить этот файл в тот же каталог, что и демонстрационный код.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
    <script src="jquery.keynav.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function(){
            $('#keynavDemo div').keynav('keynav_focusbox','keynav_box');
            $('#keynavDemo div:first').removeClass().addClass('keynav_focusbox'); // give first div focus (optional)
            $('#keynavDemo div').click(function() {
                alert('key 13');
            });
        });
    </script>
    <style type="text/css">
        #keynavDemo {
            position:relative;  
        }
        .keynav_box, .keynav_focusbox {
            position:absolute;
            height:30px;
            width:30px; 
            border:1px solid black;
        }
        .keynav_box {
            background-color:green;
        }
        .keynav_focusbox {
            background-color:red;
        }
    </style>
</head>
<body>
    <div id="keynavDemo"> 
        <div class='keynav_box' style='left:0px'>0:0</div>
        <div class='keynav_box' style='left:50px'>0:1</div>
        <div class='keynav_box' style='left:100px'>0:2</div>
        <div class='keynav_box' style='left:150px'>0:3</div>
        <div class='keynav_box' style='left:200px'>0:4</div>
        <div class='keynav_box' style='left:250px'>0:5</div>
        <div class='keynav_box' style='left:300px'>0:6</div>
        <div class='keynav_box' style='left:350px'>0:7</div>
        <div class='keynav_box' style='left:400px'>0:8</div>
        <div class='keynav_box' style='left:450px'>0:9</div>
    </div> 
</body>
</html>

Кредит автор плагина , где я "позаимствовал" демонстрацию у: -)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...