Question

我刚问了这个question。

但是现在我使用了这个解决方案，我想知道是否有更有效的方法来实现这个目标。

我的下拉列表是由我的数据库中的表创建的......让我们说我的表看起来像这样：

|ID|    |SuperHero|    |Category|
 1       Batman          DC
 2       Superman        DC
 3       Aquaman         DC
 4       Spiderman       Marvel
 5       Ironman         Marvel
 6       Hulk            Marvel

有了这个表的概念，我的下拉列表看起来类似于：

DC
- 蝙蝠侠
- 超人
- 了Aquaman
惊奇
- 蜘蛛侠
- 铁人三项
- 废船

由此创建：

ViewBag.SuperHero = new SelectList(db.superhero, "ID", "SuperHero", "Category", null,null);

现在，如果你查看我上面提到的问题的链接..我有一个复选框，只有在下拉列表中选择了某些值时才需要显示。

所以，在另一个问题中我给出了解决方案，我必须这样做：

$(document).ready(function () {

    $("#chkbox").hide();

    $('#superhero').change(function () {
        var selectedActivity = $(this).val();
        $('#chkbox').hide();
        if (selectedActivity === "1", "2", "3") {
            $('#chkbox').show();
        }
    });    
});

因此，如果选择了来自DC的任何超级英雄，将显示该复选框。

可以在Javascript中完成某些操作，如果Category DC 下的任何值显示复选框，是否可以？我觉得这可能更有效率和节省时间，而不是我必须手动输入每个不同的数值..

我无论如何都没有问题！我只是想知道是否有更有效的方法来实现这一目标。

感谢任何帮助。

更新：

由new SelectList()生成的HTML：

<div class="form-group">
        <label class="control-label col-md-2 required" for="superhero">SuperHero</label>
        <div class="col-md-10">
            <select class="form-control" id="superhero" name="superhero"><option value="">-- Select SuperHero --</option>
                <optgroup label="DC">
                    <option value="1">Batman</option>
                    <option value="2">Superman</option>
                    <option value="3">Aquaman</option>
                </optgroup>
                <optgroup label="Marvel">
                    <option value="4">Spiderman</option>
                    <option value="5">Ironman</option>
                    <option value="6">Hulk</option>
                </optgroup>
                <span class="field-validation-valid text-danger" data-valmsg-for="superhero" data-valmsg-replace="true"></span>
        </div>
    </div>

Answer 1

不确定。只需检查所选选项的父母标签

即可

＆＃13;

$(document).ready(function () {

  $("#chkbox").hide();

  $('#superhero').change(function () {
    var selectedOptGroup = this.options[this.selectedIndex].parentNode.label;
    $('#chkbox').hide();
    if (selectedOptGroup === "DC") {
      $('#chkbox').show();
    }
  });    
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
  <label class="control-label col-md-2 required" for="superhero">SuperHero</label>
  <div class="col-md-10">
    <select class="form-control" id="superhero" name="superhero"><option value="">-- Select SuperHero --</option>
      <optgroup label="DC">
        <option value="1">Batman</option>
        <option value="2">Superman</option>
        <option value="3">The Flash</option>
      </optgroup>
      <optgroup label="Marvel">
        <option value="4">Spiderman</option>
        <option value="5">Ironman</option>
        <option value="6">Hulk</option>
      </optgroup>
    </select>
    <span class="field-validation-valid text-danger" data-valmsg-for="superhero" data-valmsg-replace="true"></span>
  </div>
</div>
<input type="checkbox" id="chkbox">

＆＃13;

获取复选框以显示是否选择了特定子类别下的某个项目

1 个答案: