Question

我使用内容可编辑属性“true”代替输入来实现完美的UI。我正在尝试将输入密钥更改为“密码”类型，因此尝试在段落上实现keydown事件但面临一些问题

我的HTML代码是：

<div id="usernameInput">
<p id="passwordInput" contenteditable="true" style="width: 100%;text-shadow: none;font-weight: normal; color: #ffffff;" data-ph="Password"></p>
</div>

我的jquery代码是：

$('#passwordInput').keydown(function(e){
        if (e.keyCode > 65 && e.keyCode < 90) {
            //code
            $(this).val($(this).val()+'.');
            e.preventDefault();
        }
});

但是上面的代码没有用。我甚至无法输入密钥。然后我改变了“.val “到”文字“。

更改的代码是她：

$('#passwordInput').keydown(function(e){
        if (e.keyCode > 48 && e.keyCode < 90 && e.keyCode != 8) {
            //code
            $('#passwordInput').text($('#passwordInput').text()+'.');
            e.preventDefault();
        }
});

上面的代码工作正常但我的光标向相反的方向移动。请帮我实现输入的输入密码类型。

Answer 1

问题似乎是在更换内容后地毯会一直缩回。

你的任务是将卡雷尔移到最后。至少精神上的征税方式是模拟“向下箭头”按键。

var x = jQuery.Event("keypress");
x.which = 40;
x.keyCode = 40;
$("#passwordInput").trigger(x);

在e.preventDefault();

之前插入

这显然不是最好的方法，但有效。

关于contenteditable段的Keydown事件

1 个答案: