在文本框边界附近触发事件

Question

我有一个文本框（文本框的宽度是固定的），当我靠近文本框的边界时，我必须触发一个事件。例如：在下面的文本框中，当用户在键入时触及（。）时应触发该事件。

(fixedTextBoxWidth)                  (expandableDivWidth)
       227 px                     expandable one line div
<---------------->       <---------------- unlimited width -----
-----------------|       ---------------------------------------
|            (.) |       |
|            (.) |       --------------------------------------
|            (.) |
|            (.) |
|----------------|

现在，为了做到这一点：

1. 我创建了一个具有nowrap和自动高度的div。
2. 然后复制用户在其中键入的文本。
3. 这样做之后，我只是返回该div的offsetWidth。
4. 然后最后将返回的宽度与固定的文本框宽度进行比较。检查它是否越界触发事件。

但是我无法使数学正确。我尝试了2种解决方案：

1. 由于检测到第一个事件很容易，即（227-220）<30触发一个事件然后进行后续调用，我只是存储上一次触发事件时的前一个宽度，然后使用它来扣除。

int widthToCompare = (expandableDivWidth + 25) - _prevExpandableDivWidth;
if ( widthToCompare > fixedTextBoxWidth ) {
  // fire event;
}

1. 第二种方法，我找到227的倍数，然后从可扩展div中使用返回的宽度减去它得出差值，然后检查差值是否小于30。

  

if ( (expandableDivWidth <  fixedTextBoxWidth) && (fixedTextBoxWidth - expandableDivWidth < 30) ) {
                // fire event;
}

if ( expandableDivWidth > fixedTextBoxWidth) {
            int quotient = expandableDivWidth/fixedTextBoxWidth;
            int multiply = fixedTextBoxWidth * (quotient + 1);
            int difference = multiply - expandableDivWidth;
            if ( difference < 30 ) {
                // fire event;
            }
}