JavaScript onkeypress 延迟触发

标签 javascript html dom-events

我有一个可选电话号码的 html 输入,以及 2 个 radio 输入(留言、不留言):

<input type="text" class="input-medium phoneNum2" name="secondaryPhone" id="secondaryPhone" onkeypress="toggleRadio(this)" onblur="toggleRadio(this)" placeholder="703-555-1010" value="<cfoutput>#session.secondaryPhone#</cfoutput>" />

请注意,我正在运行两个事件(删除其中一个事件会产生相同的问题,这两个事件都有帮助,但除非必要,否则我宁愿只运行一个事件)。

这里的场景是:第二次有人开始在输入中键入内容时,它会检查是否已选中其中一个单选按钮。如果没有,则默认选择是。如果由于某种原因他们不想提供电话号码而删除了电话号码,则应取消选择两个单选按钮(只有 onblur 在那里起作用)。如果在用户开始输入之前选择“不要留言”,则不应默认为"is"。

这是 JavaScript:

function toggleRadio(x) {
    y = document.getElementById("contactSecondaryYes");
    z = document.getElementById("contactSecondaryNo");
    if (x.value.length < 1) {
        y.checked = false;
        z.checked = false;
    }
    if (x.value.length > 0 && !z.checked) y.checked = true;
}

现在解决这个问题:只有当我输入 2 个字符而不是所需的 1 个字符时才会触发默认选项 yes(几乎就像代码中的延迟?)。如果我在开始输入之前选择了“否”,则一旦输入 2 个字符,它就会默认为"is"。同样,对于反向,当 onkeypress 事件期间有 0 个字符时,仅当输入在 onblur 事件期间失去焦点时,不会“取消选择”任何内容。

我使用了错误的事件吗?是不是有逻辑缺陷?没有错误消息,而且我不能在这里使用 jQuery,所以请不要给我 jQuery 答案或通常的“为什么不使用 jQuery?” (我喜欢 jQuery,我只是有理由不能使用它)。

编辑:我也尝试过像这样订购 JavaScript,但没有成功。

function toggleRadio(x) {
    y = document.getElementById("contactSecondaryYes");
    z = document.getElementById("contactSecondaryNo");
    if (x.value.length > 0 && !z.checked) y.checked = true;
    if (x.value.length < 1) {
        y.checked = false;
        z.checked = false;
    }
}

基本上我想知道为什么代码表现得像有延迟,有没有办法修复它?

最佳答案

尝试使用 onkeyup 代替:

onkeyup="toggleRadio(this)"

关于JavaScript onkeypress 延迟触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19097452/

相关文章:

javascript - 如何在 Javascript 数组中存储 MySQL 日期?

javascript - Cordova 将 PDF 写入文件

javascript - 使用函数内的提示输入填充数组

javascript - 在输入文本框中输入字符后移动到新页面

javascript - 当用户打开列表框时向列表框添加处理程序?

javascript - 使用 Snap 对分组/分层 SVG 进行动画处理

javascript - 单击按钮时使用数组元素更改标签内容

javascript - 显示加载图像

javascript - 多个事件监听器的顺序

javascript - 自动完成滚动