在表格行中,按下回车键,调用jQuery focusout

On table row with contenteditable on ENTER click call jQuery focusout

本文关键字:调用 jQuery focusout 回车 表格      更新时间:2023-09-26

我在HTML中有一个表格,它的contenteditable设置为true。

现在当我想保存我的更改时,我可以点击其他地方(focusout),它会保存我的更改。

我想点击"Enter"键来完成与focusout相同的功能。

我尝试了这个,但它没有工作:

$(document).ready(function(){
  $('td.editable-col').on('focusout', function() {
    data = {};
    data['val'] = $(this).text();
    data['id'] = $(this).parent('tr').attr('data-row-id');
    data['index'] = $(this).attr('col-index');
      if($(this).attr('oldVal') === data['val'])
    return false;
    $.ajax({   
          type: "POST",  
          url: "server.php",  
          cache:false,  
          data: data,
          dataType: "json",       
          success: function(response)  
          {   
            //$("#loading").hide();
            if(response.status) {
              $("#msg").removeClass('alert-danger');
              $("#msg").addClass('alert-success').html(response.msg);
            } else {
              $("#msg").removeClass('alert-success');
              $("#msg").addClass('alert-danger').html(response.msg);
            }
          }   
        });
  });
});

//这是ENTER键调用focusout的地方

$('td.editable-col').on("keydown",function(e){
    var key = e.keyCode || e.charCode;  // ie||others
    if(key == 13)  // if enter key is pressed
        $(this).blur();  // lose focus
});

找到解决方案

 e.preventDefault();

修复此问题