Flot绘制图表然后无缘无故重定向

时间:2011-06-22 20:49:46

标签: javascript jquery flot

我正在使用flot来绘制一些数据。我在表单中输入开始日期和结束日期,然后检索要绘制的数据。图表显示正常,但随后网址被重定向到同一页面,但附加“?0 = on& 1 = on& 2 = on& 3 = on& 4 = on& 5 = on”不存在。这是我的代码:

    <form onsubmit='formValidator()' >
        Start Date: <input type='text' id='date1' /><br />
        End Date: <input type='text' id='date2' /><br />
    <input type='submit' value='Go' />

    <div align="center"><div id="placeholder" style="width:80%; height: 700px"></div></div>

    <p id="choices" style="color:#FFFFFF">Show:</p>

    <script type="text/javascript" id="source">


function formValidator(){
    // Make quick references to our fields
    var d1 = document.getElementById('date1');
    var d2 = document.getElementById('date2');
    var msg = "Please enter the date in the format yyyymmdd. e.g. 20110609 for June 9, 2011";
    // Check each input in the order that it appears in the form!
    if(notEmpty(d1, msg)&& notEmpty(d2, msg) && isNumeric(d1, msg)&& isNumeric(d2, msg)&& lengthRestriction(d1, msg)&& lengthRestriction(d2, msg)){
        $(function () {
                var date1   = d1.value;
                var date2   = d2.value;

/* foo1-6 are arrays that get their assigned values here */

                var datasets    =   [
                    {label: "Foo1", data: foo1      },
                {label: "Foo2", data: foo2      },
                {label: "Foo3", data: foo3      },
                {label: "Foo4", data: foo4      },
                {label: "Foo5", data: foo5      },
                {label: "Foo6", data: foo6      }
                ];

                // hard-code color indices to prevent them from shifting as
                // options are turned on/off
                var i = 0;
                $.each(datasets, function(key, val) {
                    val.color = i;
                    ++i;
                });


                // insert checkboxes 
                var choiceContainer = $("#choices");
                $.each(datasets, function(key, val) {
                    choiceContainer.append('<br/><input type="checkbox" name="' + key +
                                           '" checked="checked" id="id' + key + '">' +
                                           '<label for="id' + key + '">'
                                            + val.label + '</label>');
                });
                choiceContainer.find("input").click(plotAccordingToChoices);



                function plotAccordingToChoices() {
                    var data = datasets;

                    choiceContainer.find("input:checked").each(function () {
                        var key = $(this).attr("name");
                        if (key && datasets[key])
                            data.push(datasets[key]);
                    });

                    if (data.length > 0)    {
                        var options =   {
                            legend: {
                                backgroundColor: "#000000",
                                backgroundOpacity: 0.9,
                                labelFormatter: function(label,series) {
                                    return "<div style=color:#FFFFFF>" + label + "</div>";
                                }
                            },
                            yaxis: { min: 0 },
                        }
                    };
                    $.plot($("#placeholder"), data, options);
                }

                plotAccordingToChoices();

            });
    }   
}

1 个答案:

答案 0 :(得分:2)

必须得出结论,页面上还有一些导致该行为的其他javascript:您是否将页面缩小为仅jquery,flot和数据源,并确保您没有其他用户提供的javascript导致重装? flot库中没有任何内容可以导致自动重新加载,所以我猜测它是你的app部署的框架的一些工件。