keynav jquery插件无法正常工作
问题描述:
我无法移动任何网页上的荧光笔div,其运动只能通过4个箭头键(和第五个键(其中键码为13)的帮助),我不会知道什么是第五个关键及其目的。我使用keynav插件的目的和一些额外的代码插入荧光笔,但所有徒劳keynav jquery插件无法正常工作
答
如果是你使用的jquery.keynav插件,那么它工作得很好,即使使用最新的jQuery( V1.6.1)。在计算中,ASCII是字符编码方案,并且13
是 的编号↵(回车)密钥(请参阅ASCII Control characters)。
的jQuery插件是专为箭头键↑↓←→移动选择框周围和↵键射击的.click()
事件。
这是一个使用插件的演示。您需要将plugin code保存为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>
增光plugin author,在那里我从:-)
thanx的答案,现在我只是想“借”的演示中,你看到这个 ,我相信你会解决的疾苦它继续 – Roadrunner 2011-05-24 10:36:38
thanx的答案代码现在我只想让你看到这个 ,我相信你会解决它仍然代码的困境 看到这个 http://stackoverflow.com/questions/6109193/jquer -keynav - 不工作,后加入新代码 – Roadrunner 2011-05-24 10:47:26