入力フィールドの列にフォーカスを自動的に移動する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>
私はこの答えに出くわしましたが、それを実装する方法がわかりません。HTMLフォーム入力をFlaskに接続して、ローカルデータベースに追加できるようにする簡単な方法がある場合は、それもお知らせください。
ありがとうございました!
結局のところ、スクリプトはフォームと同じブロックコンテンツ内にある必要があります...すべてが機能するようになりました!
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加