2016-08-05 1 views
2

この質問は私のスキルを超えています。jqueryのチェック値の変更値が増えた

チェックボックス3のチェックを外すと、入力3,4,5,6,7,8,9の値を変更します。
チェックボックス6のチェックを外すと、入力6の値を変更したい、 7,8,9。
Xのチェックを外すと、入力X ++の値を変更したいと思います。私は9チェックボックスを持っている

<code> 
$('input[type=checkbox][name=checkbox_5]').on('change', function() { 
    if ($(this).is(":not(:checked)")) { 
     $('input[type=text][name=input_5]').val(''); 
     $('input[type=text][name=input_6]').val(''); 
     $('input[type=text][name=input_7]').val(''); 
     $('input[type=text][name=input_8]').val(''); 
     $('input[type=text][name=input_9]').val(''); 
    } 
}); 
</code> 


私はこのjqueryのコードを書きました。私はこのチェックボックスごとにこのスニペットを書いてはいけません。 これを解決するお手伝いをしてもらえますか?

私はインクリメントを使うのが好きですが、どうやってそれを行うのか分かりません。

https://jsfiddle.net/j4q6jm6u/

+0

でそれよりも大きいインデックスを持つテキストフィールドの値を変更し、次にクリックしたチェックボックスのインデックスを取得するために.index()を使用することができますフィドルをしてください –

答えて

1

あなたはそれを置く:gt()


 
$('input[type=checkbox]').on('change', function() { 
 
    var index = $("input[type=checkbox]").index(this); 
 
    console.log(index) 
 
    if ($(this).is(":not(:checked)")) {  
 
     $('input[type=text]:gt('+index+')').val('');  
 
    }else { 
 
    $('input[type=text]:gt('+index+')').val(index); 
 
    } 
 
}); 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text"><br> 
 
<input type="text"><br> 
 
<input type="text"><br> 
 
<input type="text"><br> 
 
<input type="text"><br> 
 
<input type="text"><br> 
 

 
<input type="checkbox"> 
 
<input type="checkbox"> 
 
<input type="checkbox"> 
 
<input type="checkbox">

+1

非常に良い解決策 - +1 – gibberish

関連する問題