セレクトボックスで選択したvalue="<?= $mediaTempKey ?>"と、
foreachで出力したvalue="<?= $mediaTempKey ?>"を比較して、
valueが同じ時にclass="hide"を外して、表示させたいのですが、
思った様に動作しません。
セレクトボックスで選択して、value="<?= $mediaTempKey ?>"が同じ<li class="mediaTempClass nav-item mb-1" value="<?= $mediaTempKey ?>">を表示させて、それ以外は非表示にしたいのですが、先頭のvalue="0"の時はclass="hide"が外れるのですが、それ以外の数字の時は、class="hide"が外れません。
$rows['measure_nows']->mediaTemp には配列が入っていて、$mediaTempKey => $mediaTempVal
でforeachしています。
["mediaTemp"]=> array(5) { [0]=> float(28.5) [1]=> float(29.5) [2]=> float(30.5) [3]=> float(31.5) [4]=> float(32.5) }
<li class="nav-item mb-1"> <select class="mediaTempSelect form-control form-control-sm"> <?php foreach ($rows['measure_nows']->mediaTemp as $mediaTempKey => $mediaTempVal): ?> <option value="<?= $mediaTempKey ?>"> <?= $mediaTempKey ?> </option> <?php endforeach; ?> </select> </li> <?php foreach ($rows['measure_nows']->mediaTemp as $mediaTempKey => $mediaTempVal): ?> <li class="mediaTempClass nav-item mb-1" value="<?= $mediaTempKey ?>"> <div class="btn btn-outline-warning btn-block"> 培地温度<br> <span id="mediaTemp"> <?= $mediaTempVal ?> </span> </div> </li> <?php endforeach; ?> <script> $(".mediaTempSelect").on('change', function(){ var select = $(".mediaTempSelect").val(); $(".mediaTempClass").each(function(){ $(".mediaTempClass").addClass('hide'); if($(".mediaTempClass").val() == select){ $(this).removeClass('hide'); } }); }); </script>
原因を教えていただけませんでしょうか。。。
よろしくお願いします!
回答1件
あなたの回答
tips
プレビュー