jquery - 単語の横にある入力ボックスを検索

Question

フォームがあります...

<form id='form1'>
   First Name:
   <input type="text"> 
</form>

First Name単語を見つけて、次の入力を探し、値「Joe」を追加できるようにしたいと思います。名前の周りにラベルタグがある場合もあれば、入力の周りにdiv/spanタグがある場合もあります。上記は基本的な例です。

私のコードはこのように見えますが、もちろん正しく機能しません。ありがとう。

$('#form1').text($(this).find('First Name').next().val('Joe'));

score 0 · Accepted Answer

jsBinデモ

Simle：use .eq()（または:eq()）
フォーム内で、希望する入力は（たとえば）最初の入力になると思います。

<form id='form1'>  
   First Name:
   <input type="text">  
   Last  Name:
   <input type="text">  
   Comment:
   <input type="text">     
</form>

必要なのはこれだけです。

$('#form1 input').eq(0).val('Joe');

だからいつの日かあなたは落ち着いてあなたのページでもっと多くの言語を使うことができます:)

score 0 · Accepted Answer

これは悪い考えです。この方法でラベルを検索すると、ブラウザは必要以上に多くの要素を検索することになります。テキストボックスに ID を使用し、ID を介して要素を取得する必要があります。

<label for="firstname">First Name: </label><input id="firstname"/>

$('#firstname').val('joe');

別の方法:

<label for="firstname">First Name: </label><input id="firstname" class="firstname"/>

$('input.firstname').val('joe');

また

<label for="firstname">First Name: </label>
<input id="firstname" inputtype="firstname"/>

$('input[inputtype="firstname"]').val('joe');

score 0 · Accepted Answer

HTML でラベルと入力を関連付ける従来の方法は、次の<label>タグを使用することです。

<form id='form1'>
    <label for='firstName'>First Name</label>
    <input type='text' name='firstName' id='firstName'/>
</form>

ラベルforは ID によって入力に関連付けられているため、ラベルから入力を選択するには、次のようにします。

document.getElementById($('label[innerHTML="First Name"]').get(0).htmlFor).value += Joe;

または、入力の id を使用します。

document.getElementById('firstName').value += 'Joe';

score 0 · Accepted Answer

jQuery はテキストを選択するためのものではなく、要素を選択するためのものです。たとえば、入力first_nameに名前を付けた場合、入力を直接選択できます

$("input[name=first_name]", "#form1")

入力が何らかの有用な方法で HTML ページによって使用される名前 ID またはクラスを持たなければならない場合、その前にあるテキストに基づいて入力を選択する理由はまったくありません。