Jquery 使输入字段中的文本模糊

我想知道这是否可能。我有一个超时插件，这样，如果我的用户离开计算机，就会出现一条警告消息，然后他们可以单击任何地方继续

我的问题是，当警告屏幕关闭时，背景页面上输入字段中输入的信息需要模糊，因此如果有人查看屏幕，他们将无法看到输入的内容

我正在考虑使用css或jQuery模糊输入字段中的信息。我环顾了一下互联网，看看是否有其他人这样做过，但我能找到的只是模糊了输入字段的边缘

---

任何帮助都会很好

也许你可以隐藏文件

---

例如

$（.filled）.hide（）

将css3模糊过滤器应用于输入元素，例如：

input,textarea{
   filter: blur(1px);
  -webkit-filter: blur(1px);
}

但它不是跨浏览器的

---

将给你这个结果：

给你，我在评论中提到的想法：

var time=function(){
    $('input').css('color','transparent');
    $('p').html('click anywhere');
}
setTimeout(time,5000);
$(document).click(function(){
    $('input').css('color','black');
    $('p').html('Wait for 5 seconds');
    setTimeout(time,5000);
});

主体输入，主体文本区域{框阴影：0 0 5px 5px rgba（0,0,0,2）！重要；边框颜色：rgba（0,0,0,05）！重要；调整大小：无！重要；不透明度：.5！重要；}
正文输入、正文输入[type=“file”]、正文输入[type=“checkbox”]、正文输入[type=“radio”]，
正文文本区域{不透明度：.4！重要；背景：透明无！重要；颜色：透明；文本阴影：0.5px rgba（0,0,0,0.5）；}
形式元素


文本框


文本框文本区


上传


按钮


复选框


单选按钮


选择框
选择框
选择框

正如我在评论中提到的，您可以将

颜色设置为与元素
背景颜色相同的颜色：

// Elements to manipulate. Any input, textarea and select,
// ignoring the buttons (for this example).
var els = $(":input:not(button)");
// Store the current color,
var defaultColor = els.first().css("color");
// Store the current background-color.
var bgColor = els.first().css("background-color");

// I'm using a button to hide the elements.
// You'll have your own event to fire this up.
$("#hide").on("click", function () {
    // Set the color of all elements to be the same as their
    // background-color.
    els.css("color", bgColor);
});

// I'm using a button to show back the elements.
// You'll have your own event to fire this up.
$("#show").on("click", function () {
    // Restore the color of all elements to their default.
    els.css("color", defaultColor);
});


我认为模式对话框是正常的模式。@j08691是否要模糊页面上的所有输入？我有这个警告，这是有效的…我现在只担心页面的其余部分。我认为最好将
输入的
颜色更改为
透明
，然后单击，将其更改回来！“模式”对话框将用于显示您的警告，同时覆盖/模糊其背后的所有内容。@j08691我已经有了一个模式窗口……虽然它不够大，无法覆盖整个页面，但我不想让它变得更大。我不一定要隐藏我的字段，这只适用于webkit，如果我没有弄错的话，它将应用于整个页面。这是一个很棒的想法！非常感谢你！这是如此简单，但如此有效！
// Elements to manipulate. Any input, textarea and select,
// ignoring the buttons (for this example).
var els = $(":input:not(button)");
// Store the current color,
var defaultColor = els.first().css("color");
// Store the current background-color.
var bgColor = els.first().css("background-color");

// I'm using a button to hide the elements.
// You'll have your own event to fire this up.
$("#hide").on("click", function () {
    // Set the color of all elements to be the same as their
    // background-color.
    els.css("color", bgColor);
});

// I'm using a button to show back the elements.
// You'll have your own event to fire this up.
$("#show").on("click", function () {
    // Restore the color of all elements to their default.
    els.css("color", defaultColor);
});