简体   繁体   English

用于显示饼图的onclick()jQuery / JavaScript按钮不起作用

[英]onclick() jQuery/JavaScript Button to display piechart doesn't work

<a data-role="button" data-transition="flip" href="#feedbackmain" inline style="height:120px" type="button" name="feedbackLink">
        <img src="icons/report.png" inline style="height:80px"/><br/>Feedback
</a>

So I have this button as shown above and I am trying to trigger it to open a pie chart for me. 所以我有上面显示的按钮,并且我试图触发它为我打开一个饼图。 Problem is that I can't seem to get the button to work. 问题是我似乎无法使用该按钮。 I can also create the piechart upon webpage load if possible but haven't been able to figure out how to do that either. 如果可能,我也可以在加载网页时创建饼图,但也无法弄清楚该怎么做。 My pie chart is made in jQplot and is generated like this: 我的饼图是在jQplot中制作的,生成方式如下:

function drawChart(data) {
     var data = data;

      var options = {
          title: 'Pie Chart',
          seriesDefaults: {
            renderer: jQuery.jqplot.PieRenderer,
            rendererOptions: {
              showDataLabels: true,
              dataLabels: 'value',
              fill: false,
              sliceMargin: 5,
              lineWidth: 5,
              startAngle: 45
            }
          },
          legend: { show:true, location: 'w' }
        };

      $.jqplot('chartDivId', data, options);
    }

Now, I tried calling the function like this: 现在,我尝试调用如下函数:

$(document).ready(function()
    {
    drawChart([[["data1",6],["data2",5],["data3",2]]]);
})

I get a transparent box where the chart is supposed to be drawn, but ... it's transparent. 我得到一个应该在其上绘制图表的透明框,但是...是透明的。 I can make a button with an onClick function on the same div with data-role: page and get that to work, but I'd rather have it load on startup as I need the data1,data2,data3 parameters loaded from MySQL via PHP. 我可以在具有data-role:page的同一个div上创建一个具有onClick函数的按钮,并使其起作用,但是我宁愿在启动时加载它,因为我需要通过PHP从MySQL加载的data1,data2,data3参数。 I can't even get contact with the button shown in the first snippet with the following code: 我什至无法通过以下代码与第一个代码段中显示的按钮联系:

$("#feedbackLink").click(function()
        {
        alert("2");
        })
    });

Anyone know how to fix this? 有人知道怎么修这个东西吗? Either get the button to do it for me OR have the chart load automatically with the rest of the script. 获取按钮为我执行此操作,或者随脚本的其余部分自动加载图表。

EDIT: I even stripped it down to this: 编辑:我什至剥夺了它:

$(document).ready(function()
    {
        $("#test").click(function()
        {
            alert("2");
        })
})

And the button: 和按钮:

<div data-role="page" id="page1">
    <input type="button" id="test" value="test"/>
</div>

I deleted basically everything else in the whole page, and still no damned contact :U 我基本上删除了整个页面中的所有其他内容,仍然没有该死的联系方式:U

add a id attribute to the anchor link and then try... it will surely work 将一个id属性添加到锚链接,然后尝试...它肯定会工作

in jquery # resembles the id of the element 在jQuery #类似于元素的ID

$("#feedbackLink").click(function()
        {
        alert("2");
        })
    });

You need to add the id attribute to the anchor so you can handle the click event with JQuery 您需要将id属性添加到锚点,以便可以使用JQuery处理click事件

<a data-role="button" data-transition="flip" id="feedbackLink" href="#feedbackmain" inline style="height:120px" type="button" name="feedbackLink">
    <img src="icons/report.png" inline style="height:80px"/><br/>Feedback
</a>

also you need to make sure that your event handler is written in the $(document).ready() 您还需要确保事件处理程序写在$(document).ready()中

$(document).ready(function(){
    $("#feedbackLink").click(function(){
      alert("2");
    })
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM