在單選按鈕選擇更改上更改圖形-ASP.NET MVC

Question

我使用Microsoft圖表，並且在下面的代碼行中獲取圖表。

 <img src="@Url.Action("GetChart")" alt="Bar Chart using MVC" class="img-responsive" />

我有一個單選按鈕列表，更改選擇后，我需要在同一位置顯示其他圖表。

<form method="post" id="frmFormType">
        @Html.Label("Select Chart Type")
        @Html.RadioButton("rbChartType", "1", isChecked: true) @Html.Label("First Option")
        @Html.RadioButton("rbChartType", "2", isChecked: false) @Html.Label("Second option")
    </form>

我不確定是否可以在此“ rbChartType”上使用jQuery更改功能或使用一些利用Form的功能。 我真的不需要重新發布頁面，而只需更改圖表。 當使用jQuery更改選擇時，我不確定如何重新獲取新圖表。 誰能給我一點啟示嗎？ 謝謝

Answer 1

都有兩個圖像：

用這種方法制作它們：

 $(function () { $("input").click(function () { $(".graph").addClass("hidden"); $("#" + $(this).attr("value")).removeClass("hidden"); }); }); 

 img {display: block;} .hidden {display: none;} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <label><input type="radio" name="graph" value="graph-1" /> Graph 1</label> <label><input type="radio" name="graph" value="graph-2" /> Graph 2</label> <img src="https://placeholdit.imgix.net/~text?txtsize=50&txt=Graph%201&w=200&h=200" class="graph hidden" id="graph-1" /> <img src="https://placeholdit.imgix.net/~text?txtsize=50&txt=Graph%202&w=200&h=200" class="graph hidden" id="graph-2" /> 

Answer 2

你可以試試！

$(function(){
   $(":radio").click(function() { 
       //do something 
    }); 
})

如果以上解決方法無效，請使用瀏覽器的調試功能查找正確的文檔。 這樣，您可以使用jquery操作文檔。

---

首先，如果要通過單擊單選按鈕更改src的img，則必須獲取每個RadioButton的src。 $（function（）{$（“ input：radio”）。click（function（）{if（$（this）.is（“＃1”））{$（“。img”）。css（'background' ，src1）;}其他{$（“。img”）。css（'background'，src2）;}}）