Question

编辑：原来我需要像他们here一样将@RenderBody（）上方的_Layout文件中的jquery引用移至enter image description here

当下拉菜单中的数据符合我的要求时，我正在尝试“激活”我的提交按钮。因此，当第一个下拉列表中的数据停止与第二个下拉列表中的数据匹配时，“提交”按钮应从灰色变为橙色。

包括了我试图实现这种功能的JavaScript，但是根据Visual Studios调试器，JavaScript甚至都没有被触摸过。我是javascript的新手，根据我所做的研究，我无法判断出什么问题。

下拉列表：

 <tr>
   <td>
      @Html.DropDownListFor(m => m.Starting, new SelectList(Enum.GetValues(typeof(Location))), htmlAttributes: new { @id = "start", @style = @"  width: 192px; height: 32px; border-radius: 2px; border: solid 1px #babcbe; background-color: #ffffff;" })
    </td>
 </tr>

<tr>
  <td>
    @Html.DropDownListFor(m => m.Endpoint, new SelectList(Enum.GetValues(typeof(Location))), htmlAttributes: new { @id = "end", @style = @"  width: 192px; height: 32px; border-radius: 2px; border: solid 1px #babcbe; background-color: #ffffff;" })
   </td>
</tr>

JavaScript

<script type="text/javascript">
  $(document).ready(function() {
     $("#start").change(function() {
         var selectedStart = $("#start option:selected").val();
         var selectedEnd = $("#end option:selected").val();

         if (selectedStart != selectedEnd) {
             $("#toNext").css("background-color", "#f06424");
         } else {
             $("#toNext").css("background-color", "grey");
         }
     });
 });
</script>

最后的按钮

<button class="btn" id="toNext" input type="submit">Next</button>

如果HTML.DropDownList用于更改，请更改按钮的颜色

0 个答案: