我正在尝试编写四个按钮,每个按钮在单击时显示不同的文本(单击按钮一显示“消息一”,单击按钮二将“消息一”替换为“消息二”,等等...)。
我没有经验与flak-python,所以我不知道如何去解决这个问题。
我第一次尝试在HTML中使用这个:
<button class="btnClick" data-section="1">ONE</button>
<button class="btnClick" data-section="2">TWO</button>
<button class="btnClick" data-section="3">THEE</button>
<button class="btnClick" data-section="4">FIVE</button>
<div class="container-section">
<div data-target="1">
<p>Message one</p>
</div>
<div data-target="2" style="display:none;">
<p>Message two</p>
</div>
<div data-target="3" style="display:none;">
<p>Message three</p>
</div>
<div data-target="4" style="display:none;">
<p>Message four</p>
</div>
</div>
使用此JS:
const sections = $('.container-section');
$('.btnClick').on('click', function () {
$(sections).find('[data-target]').hide();
$(sections).find('[data-target="' + $(this).data('section') + '"]').show();
});
然而,JavaScript没有加载&因此按钮不起作用。现在我试着用HTML中的表单来实现这一点:
<form>
<input type="submit" name="1" value="One">
<input type="submit" name="2" value="Two">
<input type="submit" name="3" value="Three">
<input type="submit" name="4" value="Four">
</form>
{% if text %}
<p id="text">{{ text }}</p>
{% endif %}
到目前为止的python代码:
from flask import Flask, render_template, request, redirect, url_for
app = Flask(__name__)
@app.route('/')
def hello_world():
return render_template('index.html')
@app.route('/index.html')
def index():
return render_template('index.html')
@app.route('/arena.html')
def arena():
try:
value=request.form['submit']
if value == '1':
return render_template('arena.html', text="1")
except:
try:
return render_template('arena.html', text=request.form['text'])
except:
return render_template('arena.html', text="default")
我怎样才能让按钮工作呢?我是一定要使用表单还是可以使用原始的按钮标签呢?如果我确实需要表单,那么在python代码中需要什么来让每个按钮点击显示下面不同的文本呢?提前谢谢你。
1条答案
按热度按时间yptwkmov1#
如果你只是想改变元素的可见性,你不需要表单,用Javascript实现很容易,不用Flask。
在运行代码之前等待页面加载。注册单击事件的侦听器并切换可见性。