无法使用 'keydown' 打开模式

Question

我有一个编码的动作链接，点击它会打开一个模式弹出窗口。为了使我的应用程序可访问，我还需要能够通过按键（空格键）打开模式。单击可以正常工作，但按键不能。请帮忙。

编码动作链接：

@Html.EncodedActionLink(
    "Preview", 
    "Preview", 
    "Forms", 
    new { 
        stagingId = Model.FormData.StagingNotificationId 
    },
    new { 
        @class = "'modal-link btn btn-success'", 
        id = "decSave" 
    })

鼠标点击代码：

 $(function() {
     $('body').on('click', '.modal-link', function(e) {
         e.preventDefault();
         $(this).attr('data-target', '#modal-container');
         $(this).attr('data-toggle', 'modal');
     });
 });

按键按下代码（点击警报但不打开模态）：

$(function() {
    $('body').on('keydown', '.modal-link', function(e) {
        if (e.which == 32) {

            alert('test')

            e.preventDefault();
            $(this).attr('data-target', '#modal-container');
            $(this).attr('data-toggle', 'modal');
        }
    });
});

Answer 1

仅仅是因为点击事件会传播并触发模态点击，而 keydown 不会这样做。

试试这个

$(function () {
    $('body').on('keydown', '.modal-link', function (e) {
        if (e.which == 32) {
            $(this).trigger("click")
        }
    });
});

无法使用 'keydown' 打开模式

Cannot open modal with 'keydown'

html

model-view-controller

jquery

modal-dialog