別のフォーム入力フィールドをクリックすると、チェックボックスが自動的にオンになります

回廊

フォームのテキスト入力フィールドの横にチェックボックスを表示しようとしています。チェックボックスは通常どおりオン/オフにチェックできますが、テキスト入力フィールドをクリックすると、チェックボックスも自動的にチェックされます。

チェックボックスのラベル内にテキスト入力を入れてこれを試しましたが、機能しません。入力フィールドの代わりに通常のテキストを使用すると、正常に機能します。

<input type="checkbox" id="box">
<label for="box">
  <input type="text">
</label>

HTML / JSでこれをどのように達成できますか?私はVueJSプラグインのコンテキストで作業しています。

FZ

<input>(フォーカスして編集を開始)のクリックアクションはのをオーバーライド<label>するため、JSを使用する必要があります。

document.querySelector('#text').addEventListener('click', ()=>{
  document.querySelector('#box').checked=true
})
<input type="checkbox" id="box">
<input type="text" id="text">

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

チェックボックスをオンにすると、角度のあるリアクティブフォームで入力が無効になります

分類Dev

チェックボックスがオンになっているときにJQueryを使用してフォームに自動入力する

分類Dev

チェックボックスが選択されている場合は常に、アクセスフォームのテキストボックスにテーブルフィールドのPhoneContactsを自動入力します

分類Dev

チェックボックスを右クリックすると別のフォーム入力が表示される高度なフォーム入力

分類Dev

チェックボックスをオンにすると、モーダル内で特定の入力フィールドが表示され、他の入力フィールドが非表示になります。

分類Dev

Rails:ユーザーがURLリンクをクリックすると、フォームフィールドに自動入力されます

分類Dev

チェックボックスをオフにすると、入力タイプのテキストフィールドが繰り返されます

分類Dev

ボタンをクリックするとフォームに自動入力

分類Dev

チェックボックスがオンの場合、入力フィールドをクリアします

分類Dev

フォームフィールドの外側をクリックすると、自動入力ドロップダウンを非表示にします

分類Dev

チェックボックスをクリックすると、1つのフィールドのみがアクティブになりますか?

分類Dev

フォームと入力チェックボックスをHTMLの問題に動的に追加する

分類Dev

別のチェックボックスをクリックすると、チェックボックスがオフになります

分類Dev

各チェックボックスをオンにすると入力フィールドが表示されない

分類Dev

チェックボックスをオフにしてからチェックすると、角度フォームが無効になります

分類Dev

チェックボックスリストからチェックボックスがオフになっている場合は、入力フィールドをクリアします

分類Dev

チェックボックスフォームフィールドに入力

分類Dev

チェックボックスをオフにすると、別のチェックボックスがオフになります

分類Dev

純粋なJavaScriptのみを使用して、ボタンをクリックするとフォーム入力フィールドのインクリメントとデクリメントを動的に生成します

分類Dev

チェックボックスがオンになっている場合に入力フィールドを操作する方法

分類Dev

フォームを送信すると、チェックボックスの値は常にNULLになります

分類Dev

チェックボックスを自動入力してフィールドを選択することができません

分類Dev

動的なMySQLが入力された選択ボックスから別のMySQLテーブルにオプションフィールドを保存する

分類Dev

チェックボックスの値に基づいて入力フォームフィールドを有効/無効にします

分類Dev

無効チェックボックスは、入力ボックスがフォーカスされているときに有効になります

分類Dev

Flutterでチェックボックスをチェック->無効なチェックボックスとテキストフィールドをチェックボックスで有効にする必要があります

分類Dev

Angular7-チェックボックスがチェックされている場合にのみ入力フィールドを検証します

分類Dev

チェックボックスを選択すると、入力フィールドが表示されます。HTML

分類Dev

ファイルのアップロード(複数)が完了すると、チェックボックスが自動的にチェックされます

Related 関連記事

  1. 1

    チェックボックスをオンにすると、角度のあるリアクティブフォームで入力が無効になります

  2. 2

    チェックボックスがオンになっているときにJQueryを使用してフォームに自動入力する

  3. 3

    チェックボックスが選択されている場合は常に、アクセスフォームのテキストボックスにテーブルフィールドのPhoneContactsを自動入力します

  4. 4

    チェックボックスを右クリックすると別のフォーム入力が表示される高度なフォーム入力

  5. 5

    チェックボックスをオンにすると、モーダル内で特定の入力フィールドが表示され、他の入力フィールドが非表示になります。

  6. 6

    Rails:ユーザーがURLリンクをクリックすると、フォームフィールドに自動入力されます

  7. 7

    チェックボックスをオフにすると、入力タイプのテキストフィールドが繰り返されます

  8. 8

    ボタンをクリックするとフォームに自動入力

  9. 9

    チェックボックスがオンの場合、入力フィールドをクリアします

  10. 10

    フォームフィールドの外側をクリックすると、自動入力ドロップダウンを非表示にします

  11. 11

    チェックボックスをクリックすると、1つのフィールドのみがアクティブになりますか?

  12. 12

    フォームと入力チェックボックスをHTMLの問題に動的に追加する

  13. 13

    別のチェックボックスをクリックすると、チェックボックスがオフになります

  14. 14

    各チェックボックスをオンにすると入力フィールドが表示されない

  15. 15

    チェックボックスをオフにしてからチェックすると、角度フォームが無効になります

  16. 16

    チェックボックスリストからチェックボックスがオフになっている場合は、入力フィールドをクリアします

  17. 17

    チェックボックスフォームフィールドに入力

  18. 18

    チェックボックスをオフにすると、別のチェックボックスがオフになります

  19. 19

    純粋なJavaScriptのみを使用して、ボタンをクリックするとフォーム入力フィールドのインクリメントとデクリメントを動的に生成します

  20. 20

    チェックボックスがオンになっている場合に入力フィールドを操作する方法

  21. 21

    フォームを送信すると、チェックボックスの値は常にNULLになります

  22. 22

    チェックボックスを自動入力してフィールドを選択することができません

  23. 23

    動的なMySQLが入力された選択ボックスから別のMySQLテーブルにオプションフィールドを保存する

  24. 24

    チェックボックスの値に基づいて入力フォームフィールドを有効/無効にします

  25. 25

    無効チェックボックスは、入力ボックスがフォーカスされているときに有効になります

  26. 26

    Flutterでチェックボックスをチェック->無効なチェックボックスとテキストフィールドをチェックボックスで有効にする必要があります

  27. 27

    Angular7-チェックボックスがチェックされている場合にのみ入力フィールドを検証します

  28. 28

    チェックボックスを選択すると、入力フィールドが表示されます。HTML

  29. 29

    ファイルのアップロード(複数)が完了すると、チェックボックスが自動的にチェックされます

ホットタグ

アーカイブ