Question

非常感谢所有发帖帮助他们的人。你真是太棒了！：）

我使用了@jsfriend00解决方案，它完成了客户端浏览器缓存问题所需的功能。

您好我有关于javascript的问题：

想知道是否有办法检测用户是否正在使用textarea，这意味着用户正在向另一个用户发送消息，但还没有输入击键？

我一直在想我可以用我的私有网络流来解决我的缓存问题，如果我只能在用户没有尝试向另一个用户发送消息时才能刷新客户端浏览器缓存，因为那时显然他们放松了他们输入的内容因为自动刷新。

比如说以下textarea：

 <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

如果您想知道焦点当前是否在您的textarea中，那么您可以通过检查document.activeElement是否是您的textarea对象来检查它。

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

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

如果您想知道修改textarea的时间，这里有一些代码将在您的textarea上安装更改处理程序，并在textarea中的文本发生更改时调用您的事件处理程序。此代码适用于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 detection for textarea

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 个答案: