前端输入月份python体会动态获取数据
时间: 2023-07-15 14:15:37 浏览: 174
你可以使用Python中的requests库向后端API发送请求来获取数据。假设你有一个后端API可以接受月份作为参数并返回相应的数据,你可以在前端页面中使用JavaScript监听输入框的变化事件,当输入框的值发生变化时,通过Ajax请求将月份发送到后端API,并将返回的数据渲染到页面上。
下面是一个简单的示例代码:
HTML:
```html
<input type="text" id="monthInput" placeholder="请输入月份">
<div id="dataContainer"></div>
```
JavaScript:
```javascript
var monthInput = document.getElementById('monthInput');
var dataContainer = document.getElementById('dataContainer');
monthInput.addEventListener('change', function() {
var month = monthInput.value;
var url = '/api/data?month=' + month;
// 发送Ajax请求
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
// 渲染数据
var data = JSON.parse(xhr.responseText);
dataContainer.innerHTML = '月份:' + data.month + '<br>' +
'数据:' + data.data;
} else {
console.log('请求错误:' + xhr.status);
}
}
};
xhr.send();
});
```
Python后端API:
```python
from flask import Flask, request, jsonify
app = Flask(__name__)
@app.route('/api/data')
def get_data():
month = request.args.get('month')
# 查询数据库或其他操作获取数据
data = {'month': month, 'data': '这是 ' + month + ' 的数据'}
return jsonify(data)
if __name__ == '__main__':
app.run(debug=True)
```
这样,当用户在输入框中输入月份时,就会动态获取相应的数据并显示在页面上。当然,具体实现还需要根据你的具体业务需求进行调整。
阅读全文