python - Flask-WTForms使用jQuery移至下一个表单字段

Question

我有一个jQuery脚本，可将焦点自动向下移至输入字段的一列。

<script>
$(".input").keyup(function() {
  if (this.value.length > 0) {
    $('.input').eq($('.input').index(this) + 1).focus();
  }
});
</script>

它可以与这个简单的HTML一起使用

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="split4">
  <input type="tell" class="input" maxlength="1">
</div>
<div class="split4">
  <input type="tell" class="input" maxlength="1">
</div>
<h4>text</h4>
<div class="split4">
  <input type="tell" class="input" maxlength="1">
</div>
<div class="split4">
  <input type="tell" class="input" maxlength="1">
</div>

但是，我正在尝试将其应用于像这样用WTForms呈现的表单，并且它不起作用

<form action="" method="post" novalidate>
                    <div style="text-align: center">
                        <h3>
                        {{ render_field(form.star, class="input", required=true, size=55, autofocus=true) }}
                        </h3> <br>
                        <h3>
                        {{ render_field(form.serial, class="input", required=true, size=55) }}
                        </h3> <br>
                        <h3>
                        {{ render_field(form.weight, class="input", required=true, size=55, onchange="submit()") }}
                        </h3> <br>
                    </div>
                </form>

我遇到了this answer，但不知道如何实现它。如果有一种将HTML表单输入与Flask连接起来的简便方法，以便我可以将其添加到本地数据库中，请也告诉我。

谢谢！

Answer 1

事实证明，脚本必须与表单位于相同的块内容内……一切都可以正常工作！