简单的 HTML 输入 onkeypress 事件不起作用答案

【问题标题】：Simple HTML input onkeypress event not working简单的 HTML 输入 onkeypress 事件不起作用
【发布时间】：2012-08-23 16:08:38
【问题描述】：

我是新来的（一般是 Web 开发），我一直在试图理解为什么我的函数没有在指定事件上执行。

我找到了这篇文章，看起来和我想要的完全一样，但即使这样也没有用：

html <input type="text" /> onchange event not working

任何帮助将不胜感激。我的确切代码如下。我有一些文本输入字段（实际上是搜索框），最终我想让它在用户将数据输入文本字段时选中一个复选框，但它似乎甚至没有调用该函数。

我在阅读上述帖子时尝试了一些变体。以下是我尝试过的一些输入字段属性：

<input type="date" name="dt" size="10" value="2012-07-21" onChange="SetCheckBox('d')" />
<input type="search" size="10" name="sl" value="" onChange="SetCheckBox('n')" />
<input type="search" size="10" name="sf" value="" onkeypress="SetCheckBox('n')" />
<input type="search" size="20" name="st" value="" onkeypress="SetCheckBox(this);" />

这是我的javascript：

<script language="javascript" type="text/javascript">
    Function SetCheckBox(id) {
        alert (id.value);
        document.write('test');
    }
</script>

我试过不传递任何参数，只做一个 document.write，但它似乎没有调用该函数。是的，javascript 已启用，并且可以在页面上的其他位置正常工作！脚本在正文中，就在表单下方。

（缺乏）行为在多个浏览器中是相同的。感谢您提供任何帮助。雷

【问题讨论】：

为什么Function要大写？

标签： javascript function textbox event-handling

【解决方案1】：

对于 javascript，function 关键字是小写的。

Function SetCheckBox(id)

需要：

function SetCheckBox(id)

另外，您没有传递对象来获取 id，所以...

function SetCheckBox(id) {
        var ele = document.getElemenyById(id);
        alert (ele.value);
        document.write('test');
 }

【讨论】：

页面渲染后永远不要执行 document.write
谢谢...我知道这是小事。而我在函数中的代码只是为了测试它是否会做某事而伪造的。我使用了几种不同的方法，这就是为什么我有 id.value （这是其他页面在传递 'this' 时显示它的方式）。

【解决方案2】：

除了已经提到的Function中的大写F之外的几个问题

您的函数传递了一个名为 id 的变量，但需要一个字段
您传递的字符串不是 ID 且未引用字段
只有使用 (this) 的最后一个版本可以工作，但没有任何价值提醒
document.write 将在页面加载后调用时擦除页面及其上的所有脚本（例如，非内联）

所以代码应该是EITHER

function SetCheckBox(id) {
    var val = document.getElementById(id).value
    alert (val);
    document.getElementById('someContainer').innerHTML=val;
}

或

function SetCheckBox(fld) {
    var val = fld.value
    alert (val);
    document.getElementById('someContainer').innerHTML=val;
}

根据你的描述，我猜你想这样做：DEMO

<input type="date" id="dt" name="dt" size="10" value="2012-07-21"
onkeypress="SetCheckBox(this)" />
<input type="checkbox" id="dtChk" />

使用这个脚本

function SetCheckBox(fld) {
    var checkbox = document.getElementById(fld.id+"Chk");
    // check if something is entered, uncheck if not
    checkbox.checked=fld.value.length>0; 
}

甚至可能有这个添加

window.onload=function() {
  document.getElementById("dt").onkeypress();
}

如果在（重新）加载时字段不为空，则会选中该框

【讨论】：

这就是我想要的... :) 感谢所有的帮助！

【解决方案3】：

在javascript中，函数关键字是用小写字母写的，这里你用大写字母写了F。

【讨论】：

【解决方案4】：

onkeypress 和 onchange 事件应该可以工作

<body>
<script type="text/javascript">

function SetCheckBox() {
    alert("1");
}

</script>

<input id = "test" value="" onkeypress="SetCheckBox();" />

<input id = "test1" value="" onchange="SetCheckBox()" />

</body>

【讨论】：

与问题中的问题无关，请勿在代码中使用&lt;