ホームページ > 記事 > ウェブフロントエンド > シンプルでわかりやすい jQuery: HTML フォームと jQuery
シンプルでわかりやすい jQuery: HTML フォームと jQuery
- 王林オリジナル
- 2023-08-27 16:17:061167ブラウズ
フォーム要素の無効化/有効化
jQuery を使用すると、form 要素の disabled 属性値を disabled に設定することで、フォーム要素を簡単に無効にすることができます。これを行うには、入力を選択し、attr() メソッドを使用して入力の無効な属性を無効な値に設定するだけです。
無効なフォーム要素を有効にするには、removeAttr() を使用して無効な属性を削除するか、attr() を使用して無効な属性値を null に設定します。
フォーム要素が無効か有効かを判断する方法
jQuery フォーム フィルター式 :disabled または :enabled, を使用すると、フォーム要素が無効であるか有効であるかを (ブール値で) 簡単に選択して決定できます。明確にするために、以下のコードを確認してください。
単一のチェックボックスまたはラジオボタンを選択または選択解除します
attr() を使用して、その checked 属性を true に設定することで、ラジオ ボタン入力またはチェックボックスを選択できます。
ラジオ ボタンの入力またはチェックボックスをクリアするには、removeAttr() メソッドを使用して、checked 属性を削除するか、checked 属性値を空の文字列に設定します。
複数のチェックボックスまたはラジオボタン入力を選択/クリアします
jQuery の val() を複数のチェックボックス入力またはラジオ ボタン入力に使用して、入力をチェック済みに設定できます。これは、チェックボックスの入力値またはラジオ ボタンの入力値属性と一致する文字列を含む配列を val() メソッドに渡すことによって行われます。
注: チェックボックスまたはラジオ ボタンが選択されている場合、val() を使用しても入力要素はクリアされません。
チェックボックスまたはラジオボタンが選択されているかクリアされているかを決定します
:checked フォーム フィルターを使用して、チェックボックスの入力またはラジオ ボタンの入力がチェックされているかクリアされているかを判断できます。 :checked フィルターのいくつかの使用法を確認するには、以下のコードを確認してください。
フォーム要素が非表示かどうかを確認する方法
:hidden フォーム フィルターを使用して、フォーム要素が非表示かどうかを判断できます。 :checked フィルターのいくつかの使用法を確認するには、以下のコードを確認してください。
入力要素の値を設定/取得する
val() このメソッドは、入力要素 (ボタン、チェックボックス、非表示、画像、パスワード、ラジオ、リセット、送信、テキスト) の属性値を設定および取得するために使用できます。以下では、val() で各入力の値を設定し、val() メソッドを使用してその値を警告します。
選択した要素の選択したオプションを設定/取得します
val() メソッドを使用すると、val()<code> に渡すことで、<option># を設定できます。 <select>## 要素></select>
</option> 要素の選択された値。
<select> 要素の値を取得するには、</select>val() メソッドを再度使用して、どのオプションが選択されているかを確認します。このシナリオの val() メソッドは、選択されたオプションのプロパティ値を返します。
リーリー
複数選択要素の選択されたオプションを設定/取得する
val() メソッドを使用すると、対応する値を含む配列を val() メソッドに渡すことで、複数選択要素の選択された値を設定できます。 。
val() メソッドを使用して、選択されたオプションの配列を取得します。配列には、選択したオプションの value 属性が含まれます。
リーリー
テキストとして使用するテキスト文字列を
val() メソッドに渡すことで、<textarea> 要素のテキスト ノード コンテンツを設定できます。 </textarea><textarea> 要素の値を取得するには、再び </textarea>val() メソッドを使用して、その中に含まれるテキストを取得します。
リーリー
ボタン要素の value 属性を設定/取得します
テキスト文字列を
val() メソッドに渡すことで、ボタン要素の value 属性を設定できます。ボタン要素の値を取得するには、val() メソッドを再度使用してテキストを取得します。
リーリー
選択要素の編集
jQuery を使用すると、選択した要素の編集に関連するいくつかの一般的なタスクが簡単になります。以下に、これらのタスクの一部をコーディング例とともに示します。
リーリー
フォーム要素をタイプ別に選択する
フォーム要素をタイプ別に選択できます (例:
$('Input: Checkbox'))。jQuery は、フォーム要素をタイプ別に選択するための次のフォーム タイプ フィルターを提供します。
:text:密码:radio:checkbox:提交:image:重置:file:button
选择所有表单元素
您可以使用 :input 表单过滤器选择所有表单元素。此过滤器不仅会选择输入元素，还会选择任何 <textarea></textarea>、<select></select> 或 <button></button> 元素。在下面的编码示例中，请注意使用 :input 过滤器时包装器集的长度。
<!DOCTYPE html>
<html lang="en">
<body>
<input type="button" value="Input Button">
<input type="checkbox">
<input type="file">
<input type="hidden">
<input type="image">
<input type="password">
<input type="radio">
<input type="reset">
<input type="submit">
<input type="text">
<select>
<option>Option</option>
</select>
<textarea></textarea>
<button>Button</button>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script> (function($){
// Alerts "13" form elements
alert($(':input').length);
})(jQuery); </script>
</body>
</html>
以上がシンプルでわかりやすい jQuery: HTML フォームと jQueryの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。