我有这个HTML代码使用jinja模板:
<!doctype html>
<html>
<!-- <link rel="stylesheet" href="backup-styles.css"> -->
<body>
<h3>Select the devices to push to</h3>
{% for question in questions %}
{% set foo = "hostname" %}
<form method="POST" action="/questions">
<!-- <input type="checkbox" value="{{question[foo]}}" name="a"> -->
<input id="{{question[foo]}}" class="btn btn-default" onclick="document.getElementById('priceform').submit()" onmousedown="change(this.id)" type="submit" value="{{question[foo]}}" name="a">
</form>
<br>
{% endfor %}
<script type="text/javascript">
function change(id){
localStorage.setItem("background","#7CFC00");
document.cookie = '#7CFC00'
document.getElementById(id).style.background = localStorage.getItem("background");
}
</script>
<form method="POST">
<textarea name="textarea" style="width:250px;height:150px;"></textarea>
<input type="submit" value="submit" name="submit">
</form>
<pre> {{ content }} <pre>
</body>
</html>
我已经使用Javascript来改变提交按钮的颜色,但是我希望它在点击后永久保持相同的颜色,只有在刷新或点击其他按钮时才恢复正常。我甚至尝试使用cookie和本地存储,如上面的代码所示。这是因为for循环吗?
1条答案
按热度按时间k3fezbri1#
你确定你的框架没有在后台运行一个脚本来改变或覆盖你的按钮样式吗?
您可以尝试以下几种方法:
1.在CSS中为按钮颜色定义一个新的类(例如,命名为
"btn-selected"
),并设置该类而不是设置button.style.background1.把button标记放在
{% block %} ... {% endblock %}
声明中,因为这应该阻止jinja重写button,如果这是实际发生的话。