0

非常感谢所有发帖尝试提供帮助的人。你们太棒了！:)

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

嗨，我有一个关于 javascript 的问题：

想知道是否有一种方法可以检测用户是否正在使用文本区域，这意味着用户正在向另一个用户发送消息但还没有输入键？

我一直在想我可以用我的私人网络流解决我的缓存问题，如果我可以让客户端浏览器缓存仅在用户不尝试向另一个用户发送消息时刷新，因为显然他们会因为自动而丢失他们正在输入的内容刷新。

例如说以下文本区域：

 <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>
4

3 回答 3

2

如果您想知道焦点当前是否在您的 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);
});

​</h2>

查看您评论中的代码，我建议这样做：

<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>

于 2012-09-14T03:29:59.860 回答
0 
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
};
于 2012-09-14T03:08:55.443 回答
-1

这实际上是我要说 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
}
于 2012-09-14T03:07:34.730 回答