Javascript onKeyDown事件未触发

我制作了一个表单，其中包含一个复选框和一个小的输入字段。我制作了一个脚本来做两件事：

• 如果复选框已选中，且文本框内没有值，请将复选框的名称插入关联的文本字段
• 如果用户在文本框中键入内容，并且未选中相应复选框的复选框，请选中该复选框
• 如果用户清除文本框，请按delete/backspace/etc，从复选框中清除复选框

什么不起作用： *当用户在文本字段中键入时，复选框不会立即出现（通常分别键入两个键），即使逻辑表明在调用时，如果复选框未选中，请选中它。 *当用户使用退格/删除等清除文本区域时，复选框保持不变

工作原理：

• 用户单击复选框可将复选框值自动插入字段。用户再次单击复选框以清除文本字段中的值

function autocheck(ElementName, SectionName) {
//window.alert('keyword-' + SectionName + '-' + ElementName.toLowerCase());
    if (document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked == false)
    {
        document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked = true
    } 

    if (document.getElementById('keyword-' + SectionName + '-entry-' + ElementName.toLowerCase()).value == '')
    {
        document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked = false;
    }
}

function autofill(ElementName, SectionName) {
    ElementName=ElementName.replace(" ", "-"); 
    //window.alert('You got this: ' + ElementName);

    if(document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked == true)
    {
        document.getElementById('keyword-' + SectionName + '-entry-' + ElementName.toLowerCase()).value = document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).value;
    } else {
        document.getElementById('keyword-' + SectionName + '-entry-' + ElementName.toLowerCase()).value = '';
    }
}

下面是相关的HTML

    <input type="checkbox" name="ufs_split_keywords[]" value="Throw" id="keyword-split-throw" onclick="autofill(this.value, 'split');"> <label for="keyword-split-throw">Throw</label>
    <br>
    <input type="text" name="ufs_split_keywords_entry[]" id="keyword-split-entry-throw" style="width:100px; float: right;" onkeydown="autocheck('throw', 'split');"> 

抛出

使用onkeyup而不是onkeydown
因为只有这样才能得到字段的更改值

在按下键事件的时间点，输入值将为旧值/不变。

记住按键输入的基本生命周期：

按键关闭事件冒泡

对输入应用keyevent（主要是写入或删除）
也可以在用户持有密钥时多次应用

键控事件冒泡

这对我很有用。（只有onkeydown更改为onkeyup的代码）

函数自动检查（ElementName，SectionName）{
//alert（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））；
if（document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））.checked==false）
{
document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））。checked=true
} 
if（document.getElementById（'keyword-'+SectionName+'-entry-'+ElementName.toLowerCase（））。值=“”）
{
document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））。checked=false；
}
}
函数自动填充（ElementName，SectionName）{
ElementName=ElementName.replace（“，“-”）；
//alert（'您得到了这个：'+ElementName）；
if（document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））.checked==true）
{
document.getElementById（'keyword-'+SectionName+'-entry-'+ElementName.toLowerCase（））。value=document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））。value；
}否则{
document.getElementById（'keyword-'+SectionName+'-entry-'+ElementName.toLowerCase（））。值=''；
}
}
扔

使用onkeyup而不是onkeydown
因为只有这样才能得到字段的更改值

在按下键事件的时间点，输入值将为旧值/不变。

记住按键输入的基本生命周期：

按键关闭事件冒泡

对输入应用keyevent（主要是写入或删除）
也可以在用户持有密钥时多次应用

键控事件冒泡

这对我很有用。（只有onkeydown更改为onkeyup的代码）

函数自动检查（ElementName，SectionName）{
//alert（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））；
if（document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））.checked==false）
{
document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））。checked=true
} 
if（document.getElementById（'keyword-'+SectionName+'-entry-'+ElementName.toLowerCase（））。值=“”）
{
document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））。checked=false；
}
}
函数自动填充（ElementName，SectionName）{
ElementName=ElementName.replace（“，“-”）；
//alert（'您得到了这个：'+ElementName）；
if（document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））.checked==true）
{
document.getElementById（'keyword-'+SectionName+'-entry-'+ElementName.toLowerCase（））。value=document.getElementById（'keyword-'+SectionName+'-'+ElementName.toLowerCase（））。value；
}否则{
document.getElementById（'keyword-'+SectionName+'-entry-'+ElementName.toLowerCase（））。值=''；
}
}
扔

是的，这非常有效。我不明白OnKeyUp和OnKeyDown之间的区别。我还添加了一个OnBlur，以防用户用鼠标选择所有内容，然后使用正确的cl

  <!DOCTYPE html>
    <html>
        <head>
              <script type="text/javascript">
                        function autocheck(ElementName, SectionName) {
                    //window.alert('keyword-' + SectionName + '-' + ElementName.toLowerCase());
                        if (document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked == false)
                        {
                            document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked = true
                        } 

                        if (document.getElementById('keyword-' + SectionName + '-entry-' + ElementName.toLowerCase()).value == '')
                        {
                            document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked = false;
                        }
                    }

                    function autofill(ElementName, SectionName) {
                        ElementName=ElementName.replace(" ", "-"); 
                        //window.alert('You got this: ' + ElementName);

                        if(document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).checked == true)
                        {
                            document.getElementById('keyword-' + SectionName + '-entry-' + ElementName.toLowerCase()).value = document.getElementById('keyword-' + SectionName + '-' + ElementName.toLowerCase()).value;
                        } else {
                            document.getElementById('keyword-' + SectionName + '-entry-' + ElementName.toLowerCase()).value = '';
                        }
                    }
              </script>

        </head>
        <body>
            <input type="checkbox" name="ufs_split_keywords[]" value="Throw" id="keyword-split-throw" onclick="autofill(this.value, 'split');"> <label for="keyword-split-throw">Throw</label>
            <br>
            <input type="text" name="ufs_split_keywords_entry[]" id="keyword-split-entry-throw" style="width:100px; float: right;" onkeyup="autocheck('throw', 'split');"> 
        </body>

    </html>