Question

抱歉，我不会上传整个代码以避免抄袭，因为这是我的uni项目，但我只是想问一个简单的问题。所以基本上我有一个存储传感器数据的数据库。然后我有一个Python文件和html文件。在Python文件中，我导入了以下库和模块： cherrypy，sqlite3和jinja2。所以我通过python与我的数据库连接代码，比如select * from ...然后在html中我有代码来设置我的下拉按钮，这里是下拉按钮本身：

    <div class="dropdown">
        <button onclick="sound_hist()" class="dropbtn">Previous sound data</button>
        <div id="soundData" class="dropdown-content">
            {% for d in dates %}
                <a href="">{{d}}</a>
            {% endfor %}
        </div>
    </div>

在我的主页上创建一个下拉按钮，单击该按钮有4个选项可供选择，4个日期。但事实是，我不确定是否可以做出这样的事情，所以当选择特定的日期，即单击按钮时，数据库中的数据会显示在同一页面上？数据库本身有4列：行，日期，时间和数据。所以我想点击我的下拉列表中的任何选项（日期），当点击时，在同一页面上，靠近按钮，我将能够看到我的传感器在该日期的时间和数据。但目前，我怀疑这是否可行。有人可以帮忙吗？

Answer 1

这可以通过一些简单的Javascript来实现，如下面的示例所示，但数据必须包含在Javascript中。在您的情况下，这可能是不可能的。

我建议查看tutorials on the CherryPy website。如果要从服务器获取数据，Ajax和React教程可能是最有用的。

<html>
<body>
  <script>
    var sensorData = {
      Jan1: "January 1st Data",
      Jan2: "January 2nd Data",
      Jan3: "January 3rd Data"
    };

    function updateText() {
      var options = document.getElementById('dates');
      var display = document.getElementById('display')
      display.innerHTML = sensorData[options.value];
    }
  </script>

  <select id="dates" onchange="updateText()">
    <option value="Jan1">January 1</option>
    <option value="Jan2">January 2</option>
    <option value="Jan3">January 3</option>
  </select>

  <div id="display">Display Data Here</div>
</body>
</html>

在同一页面上单击时从数据库输出值的下拉按钮

1 个答案: