为 Ajax 请求生成多个按钮 [关闭]答案

【问题标题】：Generate multiple buttons to Ajax requests [closed]为 Ajax 请求生成多个按钮 [关闭]
【发布时间】：2015-11-17 03:05:11
【问题描述】：

我正在做一个 ASP.Net MVC 5 Web 应用程序。其中一个页面是统计页面，假设有一个 SelectList，以选择我在此页面上有多少图表（1、2、4 或 6）。然后我将拥有相同数量的按钮来单独生成每个图形

像这样：

<div id="myContainer">
  <select id="totalCharts>
     ....
  </select>
  <div id="ChartArea1">
      <button id="btn1"></button>
      <canvas id="chart1></canvas>
  </div>

    ....
  <div id="ChartAreaN">
     <button id="btnN"></button>
     <canvas id="chartN></canvas>
  </div>
</div>

然后我想在单击按钮时生成带有 Ajax 请求的每个图表。

我尝试了几种方法，但都不起作用。你能说出最简单的方法吗？

【问题讨论】：

请发布您在问题中尝试过的内容。
代码有点大，但我设法生成了几个具有不同 id 的图表，如“chart1”、“chart2”等......问题是当我想生成不同的 AJAX 请求时相同的ID
然后隔离代码的相关部分并向我们展示您到目前为止所做的工作。除了要求“最简单的方法”（这是一个相关术语，因为对一个人来说很难的事情对另一个人来说很容易），你的问题真的很不清楚，基于意见，广泛并且没有任何努力。请在您的问题中发布您需要帮助的特定代码。

标签： javascript jquery html ajax asp.net-mvc-5

【解决方案1】：

查看完整代码链接： http://jsfiddle.net/hacker1211/n72vv902/

$(document).ready(function(){
            var n=10; //no of items in dropdown
            for(i=1;i<=n;i++){
                $('#totalCharts').append('<option value="'+i+'">'+i+'</option>');
            }                   
        });     
        //code to populate divs,buttons,canvas
        $('#totalCharts').change(function(){
            for(j=1;j<=$(this).val();j++){
                $('#myContainer').append('<div id="ChartArea'+j+'"><button id="btn'+j+'">Button '+j+'</button><canvas id="chart'+j+'"> </canvas></div>');
            }
        });
        $('button').click(function(e){
            e.preventDefault();
            var url="http://www.example.com"; //put your url here
            var id=$(this).attr('id'); //if you need button id
            $.ajax(url, {
                success: function(data) {
                    //code to draw chart here
                },
                error: function() {
                    alert('Error in sending ajax');
                }
            });

        });

【讨论】：