入力値をOnclickに設定する

Question

値フォーム入力onclickを変更したいと思います。私はそれを試したが、入力値は変更されません。エラーが見つかりません。たとえば、choice-labelをクリックすると、inputはvalue 5になります。

$('.training-niveau .choice-label').click(function() { 
 
    $('#train-niveau').val(this); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="field training-niveau-icon training-niveau"> 
 
    <input id="train-niveau" class="train-niveau" name="train-niveau" value="1" type="radio" aria-required="true" autocomplete="off"> 
 
    <li class="choice-line thirst-line"> 
 
    <div class="choice-wrapper"> 
 
     <div class="choice-label">4</div> 
 
     <div class="choice-line"></div> 
 
     <div class="choice-container"> 
 
     <div class="choice-inset"></div> 
 
     <div class="choice-bg"></div> 
 
     <div class="choice-bd"></div> 
 
     <div class="choice-overlay"></div> 
 
     </div> 
 
    </div> 
 
    </li> 
 
</div>

Answer 1

​​

は、入力の値をラベルのjqueryオブジェクトに設定しています。クリック機能thisインサイド

使用$('#train-niveau').val($(this).text());

Answer 2

thisが値ではなく、関数および値（この値をしたい場合はconsole.log(this);を行い、検証するための全体のセットが含まれていません、代わりにこれを使用する：

値はお好みのラベルに設定されている場合にのみ適用され

$('#train-niveau').val(this.val()); <。

Answer 3

は、それがjQueryオブジェクトではありません、通常のjavascriptのDOM要素です。あなたが.val()を使用したい場合は、ジャストのみdocument objectで引っ張るthisを呼び出す

$('.training-niveau .choice-label').click(function(){ 
    var $this = $(this); 
    $('#train-niveau').val($this.val()); 
}); 

Answer 4

変数JavaScriptにthisを変換する必要があります。

$('.training-niveau').on('click', '.choice-label', function() { 
 
    console.log($('#train-niveau').val()); //before 
 
    $('#train-niveau').val($(this).text()); 
 
    console.log($('#train-niveau').val()); //after 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="field training-niveau-icon training-niveau"> 
 
    <input id="train-niveau" class="train-niveau" name="train-niveau" value="1" type="radio" aria-required="true" autocomplete="off"> 
 
    <li class="choice-line thirst-line"> 
 
    <div class="choice-wrapper"> 
 
     <div class="choice-label">4</div> 
 
     <div class="choice-line"></div> 
 
     <div class="choice-container"> 
 
     <div class="choice-inset"></div> 
 
     <div class="choice-bg"></div> 
 
     <div class="choice-bd"></div> 
 
     <div class="choice-overlay"></div> 
 
     </div> 
 
    </div> 
 
    </li> 
 
</div>