Javascript Konami Code, FadeIn/FadeOut Div
有没有JavaScript专家?输入konami代码后,我已经设法淡入一个div,可以单击一个按钮以淡出div,但是我必须刷新才能重新输入konami代码。我希望能够连续输入konami代码而不必刷新页面。理想情况下,我想删除该按钮,但是似乎仅使用if语句就无法使事情正常进行。
这是我到目前为止的内容:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"> <script type="text/javascript"> var kkeys = [], konami ="38,38,40,40,37,39,37,39,66,65,13"; $(document).keydown(function(e) { kkeys.push( e.keyCode ); if ( kkeys.toString().indexOf( konami ) >= 0 ) { $(document).unbind('keydown',arguments.callee); $(document).ready(function() { $(".konami").fadeIn(1000); }); } }); <script type="text/javascript"> $(document).ready(function(){ $(".btn1").click(function(){ $(".konami2").fadeOut(1000); }); }); <p class ="konami2"> Hello! Type"bye" to remove! </p> <button class="btn1">Fade out</button> |
如果在用户键入按键后清空按键历史记录数组,则应该允许该过程重复进行。因此,代替了
1 | $(document).unbind('keydown',arguments.callee); |
您可以简单地执行此操作
1 | kkeys = []; |
当然,您应该决定当用户第二次键入代码时会发生什么。这是一个可切换div可见性的版本。请注意,我升级了您的jquery版本以支持fadeToggle函数。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"> var kkeys = []; var konami ="38,38,40,40,37,39,37,39,66,65,13"; $(document).keydown(function(e) { kkeys.push(e.keyCode); if (kkeys.toString().indexOf(konami) >= 0) { kkeys = []; $(".konami").fadeToggle(1000); } }); <p class="konami2"> Hello! Type the code again to remove! </p> |
我尝试了一下,希望对您有所帮助:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | $(document).ready(function(){ //why do you need to press enter btw?"13" keyCode var kkeys = [], konami ="38,38,40,40,37,39,37,39,66,65,13"; var bkeys = []; var bye ="66,89,69"; $(this).keydown(function(e) { // if konami kkeys.push( e.keyCode ); if ( kkeys.toString().indexOf( konami ) >= 0 ) { $(".konami").fadeIn(1000); kkeys = []; } //"bye" bkeys.push( e.keyCode ); if ( bkeys.toString().indexOf( bye ) >= 0 ) { $(".konami").fadeOut(1000); bkeys = []; } }); // manual fade out using button click // no need to type to hide stuff $(".btn1").click(function(){ $(".konami").fadeOut(1000); }); }); |