javascript 如何在jquery中使用keydown事件而不影响所有键？

lztngnrs 于 2023-01-04 发布在 Java

关注(0)|答案(5)|浏览(185)

我应该阻止页面刷新使用按F5或Ctrl+F5。我准备了以下代码来达到这个目的，但当我按下任何键在页面上的函数运行，不能填充任何文本框或按下任何其他键在页面上。我该如何解决这个问题？

$(" * ").bind('keydown', 'F5', function (e) {
        e.preventDefault();
        abp.message.confirm("Are You Sure To Refresh This Page?",
            function (isConfirm) {
                if (isConfirm) {
                    window.location = "NewForm?id=" + $("#Id").val();
                }
            });
    });

JavaScript

来源：https://stackoverflow.com/questions/51166339/how-to-use-keydown-event-in-jquery-without-affecting-all-keys

5条答案

按热度按时间

33qvvth11#

F5的正确键代码为116：

$(function () {  
        $(document).keydown(function (e) {  
             if((e.which || e.keyCode) == 116){
              if(confirm("Your confirmation message...")){
                 e.preventDefault(); 
              }
             }
        });  
    });

<body>  
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>  
</body>

为完整起见添加

可以组合e.ctrlKey来检测Ctrl + F5组合键的按下。

if (evtobj.keyCode == 116 && evtobj.ctrlKey) alert("Ctrl+F5");

找到this working fiddle。

赞(0）回复(0）举报 2023-01-04

0yg35tkg2#

console.d = function(log) {
  $('#console').text(log);
}

var callback = function(e) {
  console.log(e.type, e);
  var text = e.type;
  var code = e.which ? e.which : e.keyCode;
  if (13 === code) {
    text += ': ENTER';
  } else {
    text += ': keycode ' + code;
  }
  console.d(text);
};

$('#input').keydown(callback);
$('#input').keypress(callback);
$('#input').keyup(callback);

$('.keydown').click(function(e) {
  var code = $(this).data('code');
  $('#input').trigger(
    jQuery.Event('keydown', {
      keyCode: code,
      which: code
    })
  );
});
$('.keypress').click(function(e) {
  var code = $(this).data('code');
  $('#input').trigger(
    jQuery.Event('keypress', {
      keyCode: code,
      which: code
    })
  );
});
$('.keyup').click(function(e) {
  var code = $(this).data('code');
  $('#input').trigger(
    jQuery.Event('keyup', {
      keyCode: code,
      which: code
    })
  );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<p><label>input: <input type="text" name="foo" id="input" value="" /></label></p>

<p>
  <button class="keydown" data-code="13">Trigger keydown Enter</button>
  <button class="keypress" data-code="13">Trigger keypress Enter</button>
  <button class="keyup" data-code="13">Trigger keyup Enter</button>
</p>

<p>
  <button class="keydown" data-code="65">Trigger keydown 'a'</button>
  <button class="keypress" data-code="65">Trigger keypress 'a'</button>
  <button class="keyup" data-code="65">Trigger keyup 'a'</button>
</p>

<hr />

<div id="console"></div>

赞(0）回复(0）举报 2023-01-04

koaltpgm3#

这里您尝试识别F5功能键事件，您需要该事件的键代码。
如果引用here，则F5的键代码为116。
由于您试图禁用文档事件，因此需要添加bind a event on key down of the document。

$(document).on("keydown", disableRefresh);

function disableRefresh(event){
   if(event.keyCode == 116){
     if confirm("whatever you want to confirm"){
       event.preventDefault(); 
     }
}

赞(0）回复(0）举报 2023-01-04

nhhxz33t4#

从问题的内容和一些评论来看（问题中没有清楚提及你的要求），我认为这是你应该做的。

$(document).bind('keydown', function (e) {
        if(e.keyCode == 116 || (e.keyCode == 116 && e.ctrlKey)){
            e.preventDefault(); // Prevent default bevaior only if F5 or Ctrl+F5 [thanks to the first two commenters (y) :)]
            //This is from your original post
            abp.message.confirm("Are You Sure To Refresh This Page?",
                function (isConfirm) {
                    if (isConfirm) {
                        window.location = "NewForm?id=" + $("#Id").val();
                    }
            });
        }
    });
});

查看this fiddle，看看它的实际应用。

赞(0）回复(0）举报 2023-01-04

h7wcgrx35#

$(document).keydown(function(e){
    if(e.keyCode == 116){
         e.preventDefault();
         alert("Hello!");
         return false;
    }
})

赞(0）回复(0）举报 2023-01-04

我来回答

javascript 如何在jquery中使用keydown事件而不影响所有键？

5条答案

相关问题

热门标签

最新问答