使用 onkeyup 调用 javascript 函数答案

【问题标题】：calling javascript function using onkeyup使用 onkeyup 调用 javascript 函数
【发布时间】：2013-03-27 14:45:28
【问题描述】：

我创建了一个启用/禁用提交按钮的函数，我希望它在用户在文本字段中键入内容时运行。

这是我的代码：

<form name="sidebarPostMessageForm" action="../app/NewMessageAsynch.action">
    <input type="hidden" name="conversationId" value="${conversationId}"/>
    <lalahtml:textarea id="messageText" name="messageText" onkeyup="enableDisablePostButton();" ></lalahtml:textarea>
    <input type="button" name="postMessage" id="postMessage" onclick="if(this.form.messageText.value.trim().length>0){sidebar_postMessage();this.disabled='disabled'}" value="<ezmi18n:message key="doSendMessage.Label" />"/>
</form>
<script type="text/javascript">
function enableDisablePostButton(){
    if (document.getElementById("messageText").value.trim() == "") {
        document.getElementById("postMessage").disabled="disabled";
    } else {
        document.getElementById("postMessage").disabled="";
    }
}
</script>

当我测试它时，我收到以下 javascript 错误：

错误：

ReferenceError: enableDisablePostButton 未定义 enableDisablePostButton();

就像函数 enableDisablePostButton() 不存在一样......有谁知道为什么以及我能做什么？

【问题讨论】：

当我尝试它时似乎工作正常.. 你的脚本还有更多内容吗？
不..这就是全部..：S
@periback2 尝试设置一个 jsfiddle，我试过了，它对我有用。
你是否在没有 JavaScript 的浏览器中加载它？
看看这个fiddle我清理了一下..看控制台。

标签： javascript html function onkeyup

【解决方案1】：

我认为将脚本标签放在表单标签上方应该可以解决问题。 enableDisablePostButton函数是在form标签后面定义的，所以找不到函数。

<script type="text/javascript">
function enableDisablePostButton(){
    if (document.getElementById("messageText").value.trim() == "") {
        document.getElementById("postMessage").disabled="disabled";
    } else {
        document.getElementById("postMessage").disabled="";
    }
}
</script>
<form name="sidebarPostMessageForm" action="../app/NewMessageAsynch.action">
    <input type="hidden" name="conversationId" value="${conversationId}"/>
    <lalahtml:textarea id="messageText" name="messageText"     onkeyup="enableDisablePostButton();" ></lalahtml:textarea>
    <input type="button" name="postMessage" id="postMessage" onclick="if(this.form.messageText.value.trim().length>0){sidebar_postMessage();this.disabled='disabled'}" value="<ezmi18n:message key="doSendMessage.Label" />"/>
</form>

【讨论】：

为了约定，所有的javascript代码/文件都应该在所有的html代码之后添加......这应该不能解决问题：/

【解决方案2】：

我发现了问题，伙计们！事实上，javascript 块没有被加载，因为它是异步获取的（ajax）。我现在发现了这一点，我直接在 onkeyup 属性中设置了 javascript 代码：

onkeyup="this.form.messageText.value.trim() == ''? this.form.postMessage.disabled='disabled': this.form.postMessage.disabled='';"

感谢大家的帮助！

【讨论】：