Question

我在这里有一个有效的功能：

$(function() {
    $('#LEAVE_ENTITLED').change(function(){
        $('.solop').hide();
        $('#' + $(this).val()).show();
    });
});

它的作用是根据选择显示div。

例如，选择的值是= abc，然后它将找到div。 id为abc，

我现在要做的就是展示这个div。

    <div class="box-body">
      <div class="form-group">
        <label for="COURSE" class="col-sm-2 control-label col-sm-offset-2"><span>*</span>Degree/Course:<br>(Write in full)</label>
          <div class="col-sm-5">
            <input type="text" class="form-control" id="COURSE" name="COURSE"value = "<?= set_value("COURSE"); ?>">
          </div>
      </div>
      <div class="form-group has-error col-sm-offset-7">
        <label class="control-label" for="error"><?php echo form_error("COURSE"); ?></label>
      </div>
    </div>

如果我从此选择框中选择了以下任何一项：GraduateStudies, Trade School, College, Vocational

    <div class="box-body">
      <div class="form-group">
        <label class="col-sm-2 control-label col-sm-offset-2" for="LEVEL"><span>*</span>Level:</label>
          <div class="col-sm-5">
            <select class="form-control" name = "LEVEL">
              <option value = "<?= set_value("LEVEL"); ?>"><?= set_value("LEVEL"); ?></option>
              <option value="Elementary"      > Elementary       </option>
              <option value="Secondary"       > Secondary        </option>
              <option value="College"         > College          </option>
              <option value="Vocational"      > Vocational       </option>
              <option value="Trade School"    > Trade School     </option>
              <option value="GraduateStudies" > GraduateStudies  </option>
            </select>
          </div>
      </div>
    </div>

你可以请更新我的javascript或让我换个新的吗？

感谢。

Answer 1

您可以使用select tag class name并绑定更改事件。

检查以下代码。

$(document).ready(function(){
 $('.form-control').on('change',function(){
        $('.solop').hide();
        $('#' + $(this).val()).show();
    });
});

根据选择框选择显示div

1 个答案: