5

我想加载这两个文件

<link rel="stylesheet" type="text/css" href="sewmuchcss.css">
<script type="text/javascript" src="sewmuchjs.js"></script>

只有当用户按下“上、下、下、左、右、左、右”时，我的标题中才会出现。我将如何实现这一目标？我会使用 jquery 还是 javascript。我该怎么办？提前感谢您的任何帮助或答案。

4

4 回答 4

6

我会使用 jQuery，您可以使用以下算法来检查一行中的多个键：

var keysPressed = [];
                       //  U,  U,  D,  D,  L,  R,  L,  R
var MAGIC_KEY_SEQUENCE = [ 38, 38, 40, 40, 37, 39, 37, 39 ]

$('body').on('keydown',function(e){
     var code = (e.keyCode ? e.keyCode : e.which);

     keysPressed.push( code );

     if ( keysPressed[ keysPressed.length - 1 ] == MAGIC_KEY_SEQUENCE[ keysPressed.length - 1 ] )
     {
       // so far so good

       if ( keysPressed.length == MAGIC_KEY_SEQUENCE.length )
       {
         // all keys were pressed in the right order!
         alert( 'hurray!' );

         $('<link/>').attr({
             rel:'stylesheet',
             type:'text/css',
             href:'sewmuchcss.css'}).appendTo('head');
         $.getScript('sewmuchjs.js');
       }
     }
     else
     {
       // something didn't match, so reset the list
       keysPressed = []       
     }
})​

在这里玩它：http: //jsfiddle.net/japanick/vfRqk/

于 2012-10-12T08:04:24.967 回答
1 
$('#target').keypress(function(){
     var code = (e.keyCode ? e.keyCode : e.which);
     if(code == 21) // write your preferable keycodes here
     {
          $('<link/>').attr({ rel: 'stylesheet', type: 'text/css' href:'sewmuchcss.css' }).appendTo('head');
          $.getScript('sewmuchjs.js');
     }
})

小提琴：http: //jsfiddle.net/pwunq/

于 2012-10-12T06:49:54.320 回答
0

您可以使用 jquery 热键 - https://github.com/jeresig/jquery.hotkeys

在关键事件上，您可以添加 -

<link rel="stylesheet" type="text/css" href="sewmuchcss.css">
<script type="text/javascript" src="sewmuchjs.js"></script>

这个 js 和 css 由 

$('head').append('<link rel="stylesheet" type="text/css" href="sewmuchcss.css">');  
$('head').append('<script type="text/javascript" src="sewmuchjs.js"></script>');
于 2012-10-12T06:49:35.143 回答
0

您可以使用 runat="server" 访问这两个文件并给出 id="likeme" 例如 -

 <link rel="stylesheet" type="text/css" href="sewmuchcss.css" runat="server" id="likeme" >
于 2012-10-12T06:52:14.930 回答