シンプルでわかりやすい jQuery: HTML フォームと jQuery-htmlチュートリアル-php.cn

シンプルでわかりやすい jQuery: HTML フォームと jQuery

王林

リリース： 2023-08-27 16:17:06

オリジナル

1255 人が閲覧しました

シンプルでわかりやすい jQuery: HTML フォームと jQuery

フォーム要素の無効化/有効化

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 サイトの他の関連記事を参照してください。