Question

是否可以检查特定区域/文本中是否有人点击了textarea？

例如

<textarea>
  Tanken
  17/01/1970 13:31
  KT.: Bargeld
  BN.: 00000020
</textarea>

如果有人点击日期，我想开始function()。问题是我无法使用数字位置。 Textarea的内容并非一成不变。

例如

<textarea>
  Time: 13:31
  KT.: Bargeld
  BN.: 00000020
  17/01/1970 
</textarea>

或

<textarea>
  Time: 13:31  / BN.: 00000020 / 17/01/1970 
</textarea>

唯一静态的是日期格式。

有什么想法吗？或者不可能？

Answer 1

您可以尝试获取selectionStart的{{1}}，从中导出单词（包裹在一对空格之间）。最后一步是使用正则表达式对某个日期模式测试该单词，如果它看起来像日期，只需运行您的代码：

<强> HTML ：

textarea

<强> JS ：

<textarea>
   Time: 13:31
   KT.: Bargeld
   BN.: 00000020
   17/01/1970 
   Tanken
   17/01/1970 13:31
   KT.: Bargeld
   BN.: 00000020
   Tanken
   17/01/1970 13:31
   KT.: Bargeld
   BN.: 00000020
   Tanken
   17/01/1970 13:31
   KT.: Bargeld
   BN.: 00000020
</textarea>

Demo

Answer 2

好吧，我不确定你是否可以通过简单的click 来做（也许这是可能的，但我认为它会很棘手或者根本不“干净”）。使用doubleclick事件尝试此解决方法：

现场演示： http://jsfiddle.net/W762t/

CSS：

更改光标，让我们知道textarea可点击的用户。

textarea {
    cursor: pointer;
}

<强> HTML：

我刚刚添加了一个div元素用于测试目的。

<textarea>
Tanken
17/01/1970 13:31
KT.: Bargeld
BN.: 00000020
</textarea>
<textarea>
Time: 13:31  / BN.: 00000020 / 17/01/1970 
</textarea>
<div id="log"></div>

jQuery：

代码说明：当文本上的用户doubleclicks与date提取的regex匹配时，则表示doubleclick事件是完成了date文本。因此，doubleclick事件将帮助您满足您的要求，因为它将允许抓取所选文本。

<强> e.g：

enter image description here

$(function() {

    var txt = $('textarea');

    txt.dblclick(function() {
        // Check for simple date format 'dd/mm/yyyy'
        var match = this.value.match(/\d{2}\/\d{2}\/\d{4}/);
        // If there is a match, date exists
        var date = match ? match[0] : '';
        // If date exists
        if(date) {
            // Get selection object
            var selection = window.getSelection() || 
                            document.getSelection() || 
                            document.selection.createRange();
            // Get selected text
            var word = $.trim(selection.toString());
            // Check if selected text matches date string
            if(word && date.indexOf(word) > -1) {
                // Do an action, in this case, print a log
                showLog();
            }
        }        
    });

});

function showLog() {
    $('#log').append('[DoubleClick] was done over date text<br>');
};

jQuery - 检查是否有人点击了文本字段中的特殊区域/文本

2 个答案:

Demo