2

ラベルのテキストをターゲットにして変更しようとすると、妙に苦労する

<li>
    <label></label><br/>
    <input type='tel' class='added_phone' name='' value='' maxlength='20' />
</li>

私の変数:

// Phone Inputs
var inputphone = $("<li><label></label><br/><input type='tel' pattern='[0-9]{10}' class='added_phone' name='' value='' autocomplete='off' maxlength='20' /></li>");

関数 with は、いくつの Phone オブジェクトが存在するかをチェックし、それらをページ上に作成します:

$(profileData.phones).each(function(i) {
    $('.new_option').append(inputphone);
    $('.added_phone').closest('label').text(profileData.phones[0].tag);
    $('.added_phone').attr('id', "added_"+profileData.phones[0].tag+"phone" + (i + 1));
        });
    $('.added_phone').attr('value', profileData.phones[0].label);
});

ここに画像の説明を入力

1 つ以上の電話オブジェクトがあることを確認し、入力を作成して表示し、電話番号をフィールドに入れましたが、ラベルをターゲットにしてタグ (名前) を入れることができませんでした。

最も近い、親、ラベルを試しました... コード トンネル X_x

これにどのようにアプローチしますか？

4

2 に答える 2

2

.parent() および .find() セレクターを使用して、目的の要素を見つけることができます。

ここでjsFiddle

HTML:

<div class="new_option"></div>
<input type="button" id="mybutt" value="Click Me">

$('#mybutt').click(function() {
    var inputphone = $("<li id='myLI'><label id='myLabel'></label><br/><input type='tel' class='added_phone' /></li>");
    $('.new_option').append(inputphone);
    alert($('.added_phone').parent().find('label').attr('id'));
});

ラベル フィールド自体を更新するには:

ここでjsFiddleを更新しました

$('#mybutt').click(function() {
    var inputphone = $("<li id='myLI'><label id='myLabel'></label><br/><input type='tel' class='added_phone' /></li>");
    $('.new_option').append(inputphone);
    //alert($('.added_phone').parent().find('label').attr('id'));
    $('.added_phone').parent().find('label').text('Hey there');
});
于 2013-08-26T21:43:59.420 に答える