すべてのテキストフィールドが各 keyup() と focus(); で有効かどうかを検出するフォームがあります。それらがすべて有効であれば、ユーザーが押すことができる送信ボタンが有効になります。ただし、ユーザーがブラウザのオートコンプリート機能を使用してテキスト入力の 1 つを入力すると、送信ボタンが有効になりません。
jQueryを使用して、どのように変更されたかに関係なく、入力のいずれかが変更されたかどうかを検出する方法はありますか?
すべてのテキストフィールドが各 keyup() と focus(); で有効かどうかを検出するフォームがあります。それらがすべて有効であれば、ユーザーが押すことができる送信ボタンが有効になります。ただし、ユーザーがブラウザのオートコンプリート機能を使用してテキスト入力の 1 つを入力すると、送信ボタンが有効になりません。
jQueryを使用して、どのように変更されたかに関係なく、入力のいずれかが変更されたかどうかを検出する方法はありますか?
on input
を使用して、 のテキストベースの変更 (ctrl
や などのキーを除くshift
)を検出することができます<input>
。
例えば:
$(input).on('input', function() {
console.log($(this).val());
});
jQuery 変更イベントは、ぼかしでのみ発生します。入力すると keyup イベントが発生します。オートコンプリート オプションをクリックしても起動しません。これを検出する方法も探していますが、現在は
$(selector).bind("change keyup",function(){
//Do something, probably with $(this).val()
});
しかし、それは問題を完全に解決しません...
使った自分
$(selector).on("change keyup blur input", function() {});
これはChromeでうまくいきました。input
オートコンプリートで機能するようになったのです。
jQuery.change()
関数を使用できます。
ページが最初に読み込まれた後、フォーム全体を検証して、実際に入力されていないことを確認できます。その後.change()
、フォームで変更があったかどうかを確認し、変更があった場合はフォームを再度検証できます。 。
$(document).ready(function() {
// validate form once, just to be sure (if valid, activate submit button)
});
...
<form>
<input class="target" type="text" value="Field 1" />
<select class="target">
<option value="option1" selected="selected">Option 1</option>
<option value="option2">Option 2</option>
</select>
</form>
<script type="text/javascript">
$('.target').change(function() {
alert('Something changed');
// Try validating form again (if valid, activate submit button)
});
</script>
次のプラン
もう1つのオプションは、送信ボタンを常にクリック可能にすることですが、これを使用.submit()
してフォームバリデーターにバインドします。次に、フォームが有効な場合は続行します。フォームが有効でない場合は、フォーム.preventDefault()
の送信を停止するために使用してください.....また、欠落しているフィールドを示す警告メッセージも表示されます。
答えはこの質問で与えられました。jQueryは使用しませんが、オートコンプリートで機能します。
jsonpropertychange
イベントを使用します。
同じ問題が発生した後、適切な解決策があります。フォーム フィールドに通常どおりキーアップを設定し、周囲の div にマウスオーバーします。したがって、オートコンプリート オプションをクリックすると、マウスが div の上に移動します。
$("#emailaddress").bind("keyup", function() {
displayFullSubcribeForm();
});
$(".center_left_box").bind("mouseover", function() {
displayFullSubcribeForm();
});
これは究極のソリューションであり、動作が保証されています
$(document).bind('mouseover', function(){
liveValidate();
});