Question

我开始知道在选择下拉列表中无法完成jquery拖放操作。所以我用<ul> <li>项下拉了一下。当我拖动列表项时，我需要通过ajax加载显示相应的高图。但我只能在一个div上显示图表。我需要根据所选的列表项在每个div上显示列表项的相应图表（通过ajax）。

你可以在这里找到代码..！ http://jsfiddle.net/J2vHu/17/

Answer 1

因为您对每个图表使用相同的参数（renderTo参数），这意味着您始终在第一个div中设置图表。

$(".target").droppable({
        accept: ".reports",
        drop: function(event, ui) {
            event.preventDefault;
            var id = $(this).attr('id');
            loadChart(id);
            $(".target").append(chart);
        }
    });

和ajax：

$.ajax({
        url: "http://echo.jsontest.com/data1/[40,20,30]/data2/[15,2,30]/data3/[10,,40,50]",
        dataType: "json",
        success: function(jsondata) {
            options.chart.renderTo = id;
            options.series[0].data = jsondata.data1;
            options.series[1].data = jsondata.data2;
            options.series[2].data = jsondata.data3;
            chart = new Highcharts.Chart(options);
        },
        error: function(XMLHttpRequest, error, errorThrown) {
            alert("error");
        }
    });

修复示例：http://jsfiddle.net/J2vHu/20/

jquery通过ajax拖放列表项无法正常工作

1 个答案: