使用Javascript使输入框在用户输入后的3秒内可编辑

Using Javascript to make input box editable for exactly 3 seconds after user input

本文关键字：输入 3秒 编辑 用户 Javascript 使用      更新时间：2023-09-26

我需要一个函数，当用户在输入框中输入内容时执行。该函数应该使输入框在3秒内不可编辑，然后再使输入框可编辑。我有下面的函数，但它根本不起作用。我想知道我做错了什么，以及如何解决它?

function makeUnedit (id) {
    setTimeout(function(){ document.getElementById(id).readOnly = false; }, 3000);
    success:function(setTimeout) {
        document.getElementById(id).readOnly = true;  
    }
}

这个是有效的，但是如果你垃圾输入框，比如你每100毫秒左右输入1个输入，它会覆盖它，使readOnly一直为真如果你继续以这个速度垃圾输入。

document.getElementById(id).readOnly = true;
setTimeout(function(){ document.getElementById(id).readOnly = false; }, 1500);

可以:

function makeUnedit (id) {
   document.getElementById(id).readOnly = true;
   setTimeout(function(){ 
       document.getElementById(id).readOnly = false; 
   }, 3000);
}

注意，作为参数传递给setTimeout(argument, milliseconds)的函数将在x毫秒后被调用。

success:是一个没有意义的参数，应该会抛出语法错误。

window.onload = function() {
  function makeUnedit (id) {
    document.getElementById(id).readonly = true;
    window.setTimeout(function() {
      document.getElementById(id).readonly = false;
    }, 3000);
  }
  
  document.getElementById("id").onfocus = function() { makeUnedit ("id") };
};
<input type="text" id="id"/>

据我估计，你对success关键字的使用似乎是不正确的。因为无论如何都不需要这样的陈述，这里有一个解决方案。

function makeUnedit (id) {
  document.getElementById(id).readonly = true;
  window.setTimeout(function() {
    document.getElementById(id).readonly = false;
  }, 3000);
}

为你的处理器添加下面的代码:

document.getElementById(id).onfocus = function() { makeUnedit(id) };
相关文章：