Question

没有问题从SELECT显示多个DIV，但希望将其与“预先选择”当前设置选项的MySQL查询联系起来

当前代码

$(document).ready(function () {
$('.override').hide();
$('#frmOverrideNUM').change(function () {
    $('.override').hide();
    for (i = 1; i <= parseInt($('option:selected',this).data('value')); i++) {
        $('#override' + i).show();
    }
});
});

 <select name ="frmOverrideNUM" id="frmOverrideNUM">
  <option data-value='1'  value="1" <?php if($arrRecordInfo_1[0]['overrideNUM']==1){?> selected="selected"<?php }?>>1 Day</option>
  <option data-value='2' value="2" <?php if($arrRecordInfo_1[0]['overrideNUM']==2){?> selected="selected"<?php }?>>2 Days</option>
  <option data-value='3' value="3" <?php if($arrRecordInfo_1[0]['overrideNUM']==3){?> selected="selected"<?php }?>>3 Days</option>
  <option data-value='4'  value="4" <?php if($arrRecordInfo_1[0]['overrideNUM']==4){?> selected="selected"<?php }?>>4 Days</option>
  <option data-value='5'  value="5" <?php if($arrRecordInfo_1[0]['overrideNUM']==5){?> selected="selected"<?php }?>>5 Days</option>
  <option data-value='6'  value="6" <?php if($arrRecordInfo_1[0]['overrideNUM']==6){?> selected="selected"<?php }?>>6 Days</option>
  <option data-value='7'  value="7" <?php if($arrRecordInfo_1[0]['overrideNUM']==7){?> selected="selected"<?php }?>>7 Days</option>
  <option data-value='8'  value="8" <?php if($arrRecordInfo_1[0]['overrideNUM']==8){?> selected="selected"<?php }?>>8 Days</option>
  <option data-value='9'  value="9" <?php if($arrRecordInfo_1[0]['overrideNUM']==9){?> selected="selected"<?php }?>>9 Days</option>
  <option data-value='10'  value="10" <?php if($arrRecordInfo_1[0]['overrideNUM']==10){?> selected="selected"<?php }?>>10 Days</option>

</select>

<div class="override" id="override1">content</div>
<div class="override" id="override2">content</div>
<div class="override" id="override3">content</div>
<div class="override" id="override4">content</div>
<div class="override" id="override5">content</div>

等等

所以基本上首次打开页面时，它会显示MySQL中保存的正确数量的DIV标签。

EG

<option data-value='1' value="1" >1 Day</option>
<option data-value='2' value="2" >2 Days</option>
<option data-value='3' value="3"  selected="selected">3 Days</option>
<option data-value='4' value="4" >4 Days</option>
<option data-value='5' value="5" >5 Days</option>

因此，当打开页面时，使用上面示例显示的DIV标签数量为3.然后可以根据需要重新选择其他值

Answer 1

我不知道它是否干净但似乎工作!!

   <select id="selectField">
    <option data-value='1' value="1">option1</option>
    <option data-value='2' value="2">option2</option>
    <option data-value='3' value="3" selected="selected">option3</option>
   <option data-value='4' value="4">option4</option>
   </select>
<div id="option1" class="box">Content 1</div>
<div id="option2" class="box">Content 2</div>
<div id="option3" class="box">Content 3</div>
<div id="option4" class="box">Content 4</div>

<script>   
$(document).ready(function () {
    $('#frmOverrideNUM').change(function () {
        $('.override').hide();
        for (i = 1; i <= parseInt($('option:selected', this).data('value'),10); i++) {
            $('#override' + i).show();
        }
    });
    $('#frmOverrideNUM').each(function () {
        $('.override').hide();
        for (i = 1; i <= parseInt($('option:selected', this).data('value'),10); i++) {
            $('#override' + i).show();
        }
    });
});    
</script>

使用初始视图显示多个DIV标签

1 个答案: