jquery - テキストが境界線に達したかどうかをjQueryでチェック

Question

div 内のどこにでもドラッグできるテキスト ボックスがあります (下の図を参照)。

問題は、テキストが境界線に近づいたときに警告してほしいということです。たとえば、ユーザーが入力を開始し、テキストが右の境界線に達した場合、入力を続けるにはボックスをドラッグする必要があることを示すアラートがポップアップ表示されます。それを行う機能または方法はありますか？

Answer 1

テキスト ボックスの幅が固定されていない場合は、keyUp で幅を確認できます。

$('#textBox').keyup(function() {
  var $dragBox = $('#dragBox');
  var $textBox = $('#textBox');
  var dragBoxRightSide = $dragBox.width() + $dragBox.offset().left;
  var textBoxRightSide = $textBox.width() + $textBox.offset().left;

  if ( dragBoxRightSide < textBoxRightSide ) {
    alert('WTF?');
  }
});