У меня есть этот 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?
Вы уверены, что ваш фреймворк не запускает скрипт в фоновом режиме, который изменяет или переопределяет стиль вашей кнопки?
Вы можете попробовать несколько вещей:
определите новый класс для цвета кнопки в CSS (например, назовите его "btn-selected"
) и установите этот класс вместо установки button.style.background
поместите тег кнопки в объявление {% block %} ... {% endblock %}
, так как это должно помешать jinja переопределить кнопку, если это действительно происходит.
Если вы измените цвет, он будет «постоянным». Он остается таким до тех пор, пока вы не измените его снова или не обновите страницу. Если вы хотите, чтобы он оставался ПОСЛЕ обновления страницы. Загрузите цвет из LocalStorage и установите его при загрузке страницы.