檢測文本區域是否與javascript一起使用

Question

非常感謝所有嘗試發送的人。 你們真棒！ :)

我使用了@ jsfriend00解決方案，它實現了我的客戶端瀏覽器緩存問題所需的功能。

嗨，我有一個關於javascript的問題：

想知道是否有一種方法可以檢測用戶是否正在使用文本區域，這意味着該用戶正在向另一個用戶發送消息，但還沒有Enter鍵？

我一直在想，如果僅當用戶不希望向其他用戶發送消息時才使客戶端瀏覽器緩存刷新，因為我可以使客戶端瀏覽器的緩存刷新，因為很明顯他們會因為自動輸入而失去輸入的內容，所以我可以解決我的私有網絡流的緩存問題刷新。

例如說以下文本區域：

 <html>
 <title></title>
 <head>
 <script>
 function autoRefresh(refreshPeriod) {
 var obj = document.getElementById("create"); 

     function refreshIfSafe() {
     if (document.activeElement !== obj) { 
        window.location.reload();
      } else {
        setTimeout(refreshIfSafe, refreshPeriod);
      }
   }
       setTimeout(refreshIfSafe, refreshPeriod);
 }

       autoRefresh(2 * 1000);

  </script>

  <?php echo smiley_js(); ?>

 </head>
 <body>


<?php echo form_open('controller/function') ?>
<p><label for="create">chat here:<span class="optional"></span></label>                                
<textarea name="create" id="create" onfocus="autoRefresh(this.id)" rows="3" cols="20"></textarea> 
<?php echo form_error('create'); ?>
</p>
<?php echo form_submit('submit','chat');?>
 <?php echo form_close();?>
 </body>
 </html>

Answer 1

如果您想知道焦點當前是否在文本區域中，則可以通過檢查document.activeElement是否是您的文本區域對象來進行檢查。

var obj = document.getElementById("myTextArea");
if (document.activeElement === obj) {
    // focus is currently in my textarea
}

您可以看到一個有效的演示： http : //jsfiddle.net/jfriend00/NCSed/

如果您想知道的是何時修改文本區域，則以下代碼將在文本區域上安裝更改處理程序，並在更改文本區域中的文本時調用事件處理程序。 此代碼適用於textarea對象或input對象。 與其他方法不同，它捕獲通過鍵入，通過鼠標編輯，剪切，復制，粘貼和拖放來完成的更改。 然后，您可以告訴用戶何時鍵入或何時鍵入任何文本。 這是此代碼的有效測試引擎： http : //jsfiddle.net/jfriend00/xxCkm/ 。

並且，這是代碼：

// add event cross browser
function addEvent(elem, event, fn) {
    if (elem.addEventListener) {
        elem.addEventListener(event, fn, false);
    } else {
        elem.attachEvent("on" + event, function() {
            // set the this pointer same as addEventListener when fn is called
            return(fn.call(elem, window.event));   
        });
    }
}

function onChange(elem, fn, data) {
    var priorValue = elem.value;

    function checkNotify(e, delay) {
        // log('checkNotify - ' + e.type);
        if (elem.value != priorValue) {
            priorValue = elem.value;
            fn.call(this, e, data);
        } else if (delay) {
            // the actual data change happens aftersome events
            // so we queue a check for after
            setTimeout(function() {checkNotify(e, false)}, 1);
        }
    }

    // Which events to monitor
    // the boolean value is whether we have to 
    // re-check after the event with a setTimeout()
    var events = [
       "keyup", false,
       "blur", false,
       "focus", false,
       "drop", true,
       "change", false,
       "input", false,
       "paste", true,
       "cut", true,
       "copy", true
    ];
    for (var i = 0; i < events.length; i+=2) {
        (function(i) {
            addEvent(elem, events[i], function(e) {
                checkNotify(e, events[i+1]);
            });
        })(i);
    }
}

然后，示例用法如下所示：

var obj = document.getElementById("test");    
onChange(obj, function(e) {
    // your code goes here for whatever you want to do 
    // when the change handler is called
    console.log("change - " + e.type);
});

查看您評論中的代碼，我建議這樣做：

<script>
function autoRefresh(refreshPeriod) {
    var obj = document.getElementById("create"); 

    function refreshIfSafe() {
        if (document.activeElement !== obj) { 
            window.location.reload();
        } else {
            setTimeout(refreshIfSafe, refreshPeriod);
        }
    }

    setTimeout(refreshIfSafe, refreshPeriod);
}

autoRefresh(2 * 1000);
</script>

Answer 2

var textarea = document.getElementById("create") ;
textarea.onfocus = function() {
    // Do something while the textarea being used by a user
};

textarea.onblur = function() {
    // Do something while the textarea not being used by a user
};

Answer 3

這個鏈接可能是您想要查看Tim Down的答案的東西。

文本區域的Javascript OnChange檢測

Answer 4

實際上，這是我要說jQuery使它變得更容易的極少數情況之一。

if($("#create").is(":focus")) {
    // element is in use
}

另一種可能是這樣的：

document.body.onfocus = function(e) {
    e = e || window.event;
    window.elementWithFocus = e.target || e.srcElement;
}
...
if( document.getElementById('create') == window.elementWithFocus) {
    // element is in use
}

檢測文本區域是否與javascript一起使用

問題描述

4 個解決方案

解決方案1
2 已采納 2012-09-14 03:29:59

解決方案2
0 2012-09-14 03:08:55

解決方案3
0 2012-09-14 03:25:26

解決方案4
-1 2012-09-14 03:07:34

檢測文本區域是否與javascript一起使用

問題描述

4 個解決方案

解決方案1 2 已采納 2012-09-14 03:29:59

解決方案2 0 2012-09-14 03:08:55

解決方案3 0 2012-09-14 03:25:26

解決方案4 -1 2012-09-14 03:07:34

解決方案1
2 已采納 2012-09-14 03:29:59

解決方案2
0 2012-09-14 03:08:55

解決方案3
0 2012-09-14 03:25:26

解決方案4
-1 2012-09-14 03:07:34