Question

我对JavaScript完全陌生，想要在点击按钮时显示图表。更确切地说，我有一个字段，你可以写一些东西，我想用名称＆＃34;示例＆＃34;显示图表。当我输入＆＃34;示例＆＃34;在该领域。现在，我有一个总是显示的图表，以及一个我可以键入的字段＆＃34; Name＆＃34;它告诉我＆＃34; Hello Name＆＃34;如果我点击按钮。它看起来像这样：

type="submit"

这是经过编辑的代码： ` 项目

2016年1月至2016年9月使用的Hashtags数量

 <html>
 <head>
    <meta charset="utf-8"></meta>
    <title>Project</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.min.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.time.min.js"> </script> 

 </head>

<body>
    <div id="barchart" style="width:1200px;height:400px"></div>
    var Hashtag, data1, options1, chart1;
    Hashtag = [[gt(2016,09,06),1],[gt(2016,07,30),1],[gt(2016,03,06),1],[gt(2016,09,27),1],[gt(2016,06,06),1]];
    data1 =[ {data: Hashtag, color: "blue", label: "Amount Hashtags"}];
    options1={
        series: {bars: {show: true}},
        xaxis: {mode: "time",tickSize: [10, "day"]},
        legend: {noColumns: 0, position: "nw"}        
        };
  $(document).ready(function(){
  chart1 = $.plot($('#barchart'),data1, options1);
    });
  function gt(year,month,day) {
        return new Date(year,month-1,day).getTime();
</script>
     <label for="eingabe">
   Ihr Name:
   <input id="feld" name="eingabe" />
 </label>
 <button id="knopf" type="button" onclick="NameEinfg()">
    Klick mich!
 </button>
 <div id="bereich"></div>

 <script>
    function NameEinfg(){
       if (document.getElementById('feld').value==''){
          document.getElementById('bereich').innerHTML ="Hallo Unbekannter";}
       else {
          document.getElementById('bereich').innerHTML ="Hallo "+document.getElementById("feld").value;}
       }
   </script>
 </body>
</html>

`

Answer 1

使用display: none作为图表的样式，然后在onclick函数中添加document.getElementById('barchart').style.display = 'block';，这应该可以解决问题。

至于名称，因为你知道如何检索字段的输入值，我相信你可以自己解决它！

JavaScript - 仅在请求时显示图表

2016年1月至2016年9月使用的Hashtags数量

1 个答案: