检查光标是否在输入文本的末尾

Question

我想做的是当我输入 test@example.com、test@example.co.uk 等电子邮件地址时，我点击 space，我想要在我可以在元素中添加 HTML 之前检查光标是否位于输入文本的末尾。

if (selectionEndofText) {
  if (e.which == 32) {
    $('#oI').append('<div class="vR"><span class="vN" data-hovercard-name="'+name+'" data-hovercard-email="'+email+'" data-hovercard-owner-id="137"><div class="vT">'+name+'</div><div class="vM"></div></span><input name="to" type="hidden" value="<'+name+'>"></div>');
    $('.vR').insertBefore('#domodal_email_receipt');
    $('#domodal_email_receipt').val('');
  }
}

完整代码：

$(document).on('keydown', '#domodal_email_receipt', function(e) {
  var fullname = $(this).val();
  var name = fullname.split(' <');
  var selectionEndofText = $(this).val().length;
  var name = name[0];
  var email = '';

  if (fullname.indexOf('<') > -1) {
    email = fullname.split('<');
    email = email[1].replace('>', '');
  }

  alert("selectionEndofText................."+selectionEndofText);

  //if (!selectionEndofText)
    if (e.which == 32) {
      $('#oI').append('<div class="vR"><span class="vN" data-hovercard-name="'+name+'" data-hovercard-email="'+email+'" data-hovercard-owner-id="137"><div class="vT">'+name+'</div><div class="vM"></div></span><input name="to" type="hidden" value="<'+name+'>"></div>');
      $('.vR').insertBefore('#domodal_email_receipt');
      $('#domodal_email_receipt').val('');
    }
});

Answer 1

除了检查 if 语句中的 space 关键字外，您还可以检查 .selectionStart 那个 returns 数字的插入符位置。因此，如果当前位置等于长度，则意味着它在输入的末尾。

要清除输入，请使用 setTimeOut 使其成为运行最后。不然里面会有一个space

if (e.which == 32 && selectionEndofText === this.selectionStart) {
  $('#oI').append('<div class="vR"><span class="vN" data-hovercard-name="'+name+'" data-hovercard-email="'+email+'" data-hovercard-owner-id="137"><div class="vT">'+name+'</div><div class="vM"></div></span><input name="to" type="hidden" value="<'+name+'>"></div>');
  $('.vR').insertBefore('#domodal_email_receipt');

  setTimeout(function(){
    $('#domodal_email_receipt').val('');
  }, 0);

}

检查光标是否在输入文本的末尾

Check if cursor is end of input text

html

javascript

jquery

cursor