Question

我有一个代码，当用户从相应的字段中失去焦点时，我希望文本字段中的文本模糊一点

我有一个代码但我不知道该改变什么，因为我是javascript的初学者我的HTML代码 -

Name <input type="text" id="naam" onblur="myFunction()">

和我的js -

function myFunction()
{
var x=document.getElementById("fname");
x.value=x.value./*something to make it blur*/();
}

Answer 1

Fun with blurred text

.blurry-text {
   color: transparent;
   text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

使用上述css，您可以制作 blur 文字效果。然后像这样添加类

var x=document.getElementById("fname");
x.className += ' blurry-text';

希望你理解。

<强>更新

根据您的意见，如果您使用 jQuery ，那么只需使用 addClass('blurry-text') / removeClass('blurry-text') 添加/删除课程。

但是在纯JavaScript中，你必须这样做

function blurIt() {
    var x = document.getElementById("naam");
    x.className += ' blurry-text';
}

function focusIt() {
    var x = document.getElementById("naam");
    x.className = x.className.replace("blurry-text", "");
}

JSFiddle

Answer 2

实现onblur事件的最简单方法是使用

document.FormName.fname.blur();

试试这个。

Answer 3

当元素（在本例中为输入）失去焦点时，会发生onblur事件。你可以用css实现这一点。

#naam{
   // Style this as you want it on blur
}

#naam:focus{
    // Style this as you want it when focused
}

如何在输入中模糊文本onblur事件

3 个答案:

JSFiddle