Question

这是我的简单HTML表单（简称）：

<form name="formular" action="./import.php" method="post" onsubmit="buttonClicked();">
    <input name="notes" onchange="notesChanged();" />
    <input name="info" onchange="infoChanged();" />
    <input name="doit" class="button" type="submit" value="validate" />
</form>

更改这两个字段后，按钮标签可能会更改为“提交”，“提交不同”字样。或者回到＆＃39;验证＆＃39;。通过＆＃39;标签＆＃39;编辑并离开字段时，效果很好：用户以特殊方式显示，表单已提交。

我的问题：

更改字段并通过＆＃39;标签删除不时但是直接点击按钮，标签也可能会被更改，在这种情况下，不应提交表单。

我不知道如何处理这种情况，因为所有的场事件都在任何按钮事件之前进行处理。

Answer 1

在较新的浏览器中，您可以使用input事件。其功能与change事件类似，但在触发之前不需要元素失去焦点（由于按下 tab 键或用户在页面上的其他位置单击）。 MDN entry包含有关浏览器支持的信息。

这样可以确保在用户对其他两个输入进行更改时更新按钮文本，结果是在他们点击按钮本身之前。

Answer 2

您可以使用jquery添加模糊事件。当输入字段失去焦点时它会触发：

<script type="text/javascript">
   $(function () {
     $('#notes').blur(function () {
       notesChanged();
     });

     $('#info').blur(function () {
       infoChanged();
     });
   });
</script>


<form name="formular" action="./import.php" method="post" onsubmit="buttonClicked();">
   <input id="notes"/>
   <input id="info"/>
   <input name="doit" class="button" type="submit" value="validate" />
</form>

Javascript：事件处理/内容 - 更新/提交

2 个答案: