JQuery - Html.DropDownListに変更イベントを追加する

Question

申し訳ありませんが、私はWeb開発とASP.Netを初めて使用しています。ユーザーが要素で選択したオプションを変更したときに、ブラウザに現在表示されているHTMLをどのように動的に変更しますか？

<div class="form-group"> 
     @Html.LabelFor(model => model.CategoryId, "CategoryId", htmlAttributes: new { @class = "control-label col-md-2" }) 
     <div class="col-md-10"> 
       @Html.DropDownList("CategoryId", null, htmlAttributes: new { @class = "form-control" }) 
       @Html.ValidationMessageFor(model => model.CategoryId, "", new { @class = "text-danger" }) 
     </div> 
    </div> 

    <h1></h1> 

    <script> 
     $(function() { 
      $('#CategoryId').on('change', function (e) { 
       var categoryId = this.value; 

       //do stuff to HTML based on selected value 
       if (parseInt(categoryId) === 3) { 
        $('h1').text('stuff'); 
       } 
      }); 
     }); 
    </script> 

Answer 1

解決策が見つかりました。 jqueryでインポートする必要があります。

<div class="form-group"> 
    @Html.LabelFor(model => model.CategoryId, "Category", htmlAttributes: new { @class = "control-label col-md-2" }) 
    <div class="col-md-10"> 
     @Html.DropDownList("CategoryId", null, htmlAttributes: new { @class = "form-control" }) 
     @Html.ValidationMessageFor(model => model.CategoryId, "", new { @class = "text-danger" }) 
    </div> 
</div> 


<h1></h1> 

<script type="text/javascript" src="/scripts/jquery-3.1.1.js"></script> 

<script> 
    $(function() { 
     $('#CategoryId').on('change', function (e) { 
      var categoryId = this.value; 

      //do stuff to HTML based on selected value 
      if (parseInt(categoryId) === 1) { 
       $('h1').text('stuff'); 
      } 
     }); 
    }); 
</script>