JavaScript-取消选中mouseup上的复选框 [英] JavaScript - uncheck check box on mouseup
问题描述
我正在尝试实现一个简单的显示密码"切换复选框,以便在按住鼠标的同时显示纯文本密码,放开它后,它会恢复为密码字段.
I'm trying to implement a simple 'show password' toggle check box so that whilst the mouse is held down, the plain text password is shown, and once it's let go it reverts back to a password field.
我已经启用了input
字段的切换功能,但是我也使用了一个复选框来显示切换状态,并且我可以选中mousedown
上的复选框,但是我尝试取消选中盒子工作不正常.
I've got the toggle of the input
field working, however I'm using a check box to show the toggle state as well, and I can check the box on mousedown
however my attempt at then unchecking the box is not quite working.
这是我到目前为止所拥有的;
Here's what I've got so far;
var pwi = $('#new_pass');
$('.pw_show').on('mousedown', function () {
$('.pw_show input').prop('checked', true);
pwi.prop('type', 'text');
});
$('.pw_show').on('mouseup', function () {
pwi.prop('type', 'password');
setTimeOut(function() {
$('.pw_show input').prop('checked', false);
}, 50);
});
此几乎有效,但是如果用户快速双击,则可以 break 取消选中该复选框. 有更好的方法吗?
This almost works, however if the user double clicks quickly then they can break it leaving the checkbox checked. Is there a better way to do this?
推荐答案
我的代码的问题是setTimeout
函数的拼写.解决此问题后,我添加了一个很小的延迟,允许在单击保持并释放时选中和取消选中该复选框.
The problem with my code was the spelling of the setTimeout
function. After fixing this, the small delay I added, allowed the check box to be checked and unchecked on click hold and release.
$('.pw_show').on('mouseup', function () {
pwi.prop('type', 'password');
setTimeout(function() {
$('.pw_show input').prop('checked', false);
}, 50);
});
这篇关于JavaScript-取消选中mouseup上的复选框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!