javascript - 除非更新表单数据，否则在 Firefox 中禁用表单提交

Question

我是一名新手编码员，所以请告诉我如何.. 我有一个更新表单的工作代码，除非文本区域的数据发生更改，否则它会阻止提交表单。

该代码在 chrome 中运行良好，但在 Firefox 中却不行。

$(function() {

  $('form')
    .each(function() {
      $(this).data('serialized', $(this).serialize())
    })
    .on('change input', function() {
      if (event.target.nodeName !== 'SELECT') {
        $(this)
          .find('input:submit, button:submit')
          .attr('disabled', $(this).serialize() == $(this).data('serialized'));
      }
    })
    .find('input:submit, button:submit')
    .attr('disabled', true);

});

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.0.js"></script>

<form action="page.php" method=\ "post\">
  <textarea Name="update" cols="50" rows="20">
    </textarea> Updation By<span style="font-weight: bold; color: rgb(204, 0, 0);">*</span> :
  <select required aria-required="true" name="user">
    <option value="" selected="true" disabled="disabled"> - Select - </option>
    <option value="user1">User 1</option>
    <option value="user2">User 2</option>
    <option value="user3">User 3</option>
  </select><br><br>
  <input name="Submit" type="submit" value="Update">
</form>

请帮助我让它在 Firefox 上运行。

标签： javascript

Answer 1

控制台错误为“未定义事件”，因此在更改时传递事件

.on('change input', function(event) {

$(function() {

        $('form')
            .each(function() {
                $(this).data('serialized', $(this).serialize())
            })
            .on('change input', function(event) {
                if (event.target.nodeName !== 'SELECT') {
                    $(this)
                        .find('input:submit, button:submit')
                        .attr('disabled', $(this).serialize() == $(this).data('serialized'));
                }
            })
            .find('input:submit, button:submit')
            .attr('disabled', true);

    });

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.0.js"></script>

<form action="page.php" method=\ "post\">
    <textarea Name="update" cols="50" rows="20">
</textarea> Updation By<span style="font-weight: bold; color: rgb(204, 0, 0);">*</span> :<select required aria-required="true" name="user">
<option value="" selected="true" disabled="disabled"> - Select - </option> 
<option value="user1">User 1</option>
<option value="user2">User 2</option>
<option value="user3">User 3</option>
</select><br><br>
    <input name="Submit" type="submit" value="Update">
</form>