グローバル変数内の変更機能

Question

変更機能の変数値を使用したいと思います。私は変数の外に変数を宣言しましたが、他の関数で使用すると未定義の値を出力します。 #secondで

$(document).ready(function() { 
 
    var test = ""; 
 
    $("input:checkbox").change(function() { 
 
     var ischecked = $(this).is(':checked'); 
 
     if (ischecked) { 
 
      test = $(this).attr('class'); 
 
     } 
 
     $('.first').text(test); 
 
    }); 
 
    $('.second').text(test); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input type="checkbox" class="all" value="Car">All 
 
<input type="checkbox" class="got" value="Car">Game of Thrones 
 
<input type="checkbox" class="bb" value="Car">Breaking Bad 
 
<input type="checkbox" class="arrow" value="Car">Arrow 
 

 
<div class="first"></div> 
 
<div class="second"></div>

変数値は不定であるDIV。

Answer 1

class値はtestに割り当てられ、入力の変更時にのみ変更されます。しかし、そのときの文字はsecondのdocument ready &に設定されています。

この問題を解決する方法は多数あります。 $('.first').text(test);と一緒に変更機能内に$('.second').text(test);を入れたり、関数を作成したりするだけで、入力の変更時にそれを呼び出すことができます& classの値を引数として渡します。以下は

あなたが設定したときに、 `test`は` "" `に設定されているfunction

$(document).ready(function() { 
     var test = ""; 
     $("input:checkbox").change(function() { 
      var ischecked = $(this).is(':checked'); 
      if (ischecked) { 
       test = $(this).attr('class'); 
      } 
      $('.first').text(test); 
    _setSecondDiv(test) 
     }); 
     function _setSecondDiv(selClass){ 
     $('.second').text(test); 
    } 
    }) 

Working Example

複数のjQueryのセレクタで

$(document).ready(function() { 
    var test = ""; 
    $("input:checkbox").change(function() { 
     var ischecked = $(this).is(':checked'); 
     if (ischecked) { 
      test = $(this).attr('class'); 
     } 
     $('.first, .second').text(test); // Changed here 

    }); 
}) 

Working Example with multiple selector