Javascript：随机文本，鼠标悬停显示真实文本

我想有一个Wordpress博客的所有作者的列表，以随机字符的形式显示，这些字符在鼠标悬停时会变成真实姓名。我对JavaScript非常陌生，我这里的代码是基于此的，因为Amir寻找的东西几乎和我一样，只是相反

我希望每个名称都有一个唯一的随机字符字符串，我知道我不应该使用class属性来实现这一点，但是如何使用id而不必手动列出所有名称呢

第二，由于我使用mouseenter，所以直到您第一次将鼠标移到文本上，随机字符串才会显示，但正确的方法是什么

提前谢谢

Javascript：

$(document).ready(function(){
var change_this = $( ".change_this" ).text();

$( ".change_this" ).mouseenter(function() {
    $( ".change_this" ).text( change_this );
});

    $( ".change_this" ).mouseleave(function() {
    var text = '';
    var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789%$';

    for(var i=0; i < $( ".change_this" ).text().length; i++)
    {
        text += possible.charAt(Math.floor(Math.random() * possible.length));
    }
    $( ".change_this" ).text( text );
});
})

$（文档）.ready（函数（）{
var change_this=$（“.change_this”）.text（）；
$（“.change_this”）.mouseenter（函数（）{
$（“.change_this”）.text（change_this）；
});
$（“.change_this”）.mouseleave（函数（）{
var text=''；
可能的风险值='ABCDEFGHIJKLMNOPQRSTUVXYZABCDFGHIJKLMNOPQRSTUVXYZ0123456789%$'；
对于（var i=0；i<$（“.change_this”）.text（）.length；i++）
{
text+=可能的.charAt（Math.floor（Math.random（）*可能的.length））；
}
$（“.change_this”）.text（text）；
});
})

PHP（我只是展示了所有内容）：

foreach（$blogusers作为$user）{
回声“
”；
}
?>

---

测试Javascript时：

是的，首先要做的是，不要让所有元素都崩溃，要意识到$（）。each（）是你的朋友。如果要对每个元素进行模糊处理，并分别处理它们的进入和离开事件，则不会出现问题。看看这个：

$（文档）.ready（函数（）{
$（“.change_this”）。每个（函数（）{
变量可能='ABCDEFGHIjklmnopqrStuvxyzabCDEFGHIjklmnopqrStuvxyz012456789%$'，randomText=“”；
//现在创建一个相同长度的随机字符串。。。
对于（var i=0；i<$（this）.text（）.length；i++）{
randomText+=可能的.charAt（Math.floor（Math.random（）*可能的.length））；
}
$（this.attr（'data-randomtext'，randomtext）.attr（'data-text'，$（this.text（））.text（randomtext））；
$（本页）({
mouseenter:function（）{
$（this.text（$（this.attr（“数据文本”））
}，mouseleave:function（）{
$（this.text（$（this.attr（“数据随机文本”））；
}
})
});
})

乔·史密斯.jpg

Daniel23.jpg

Mariahbirsak.jpg

所以是的，你要做的第一件事是意识到$（）。每个（）都是你的朋友，因为你不想让所有元素都崩溃。如果要对每个元素进行模糊处理，并分别处理它们的进入和离开事件，则不会出现问题。看看这个：

$（文档）.ready（函数（）{
$（“.change_this”）。每个（函数（）{
变量可能='ABCDEFGHIjklmnopqrStuvxyzabCDEFGHIjklmnopqrStuvxyz012456789%$'，randomText=“”；
//现在创建一个相同长度的随机字符串。。。
对于（var i=0；i<$（this）.text（）.length；i++）{
randomText+=可能的.charAt（Math.floor（Math.random（）*可能的.length））；
}
$（this.attr（'data-randomtext'，randomtext）.attr（'data-text'，$（this.text（））.text（randomtext））；
$（本页）({
mouseenter:function（）{
$（this.text（$（this.attr（“数据文本”））
}，mouseleave:function（）{
$（this.text（$（this.attr（“数据随机文本”））；
}
})
});
})

乔·史密斯.jpg

Daniel23.jpg

Mariahbirsak.jpg

foreach ( $blogusers as $user ) {
echo '<p><a href="http://www.untitled-jpg.nl/author/' . esc_html( $user->user_login ) . '/"><span class="x">' . esc_html( $user->display_name ) . '.jpg</span></a></p>'; 
}
?>