我有一个功能有一个小问题。正在使用电影应用程序，目前在预订页面上。我有模仿行和数字的表。一种功能是在单击后改变座椅的颜色（实际上是翻倍的，因为它在单击一次后不起作用，也不知道为什么）。另一个功能是负责从高空座位上收集行和数字之类的数据，以便稍后将其传递给视图。第二个函数看到console.log中的元素，但是当我想获取背景色时，它返回未定义。感谢任何提示。
{% extends "main_templates/main.html" %}
{% load static %}
{% block content %}
<div class="container">
<table class="table table-bordered ">
<tbody>
{% for row in seats_range %}
<tr>
<th scope="row" class="bg-danger">{{row}}</th>
{% for number in seats_range %}
<td class="text-center" style="width:5%;" value="{{row}}" onclick="change_bg(this)"><a href="#"></a>{{forloop.counter}}</a></td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
<button type="submit" onclick="get_all_fields()">click me</button>
<script>
function change_bg(element){
var color_to_change = "rgb(121, 12, 131)"
$(element).click(()=>{
console.log($(element).attr("value"))
var color_now = $(element).css("background-color")
if (color_now == color_to_change){
color_to_change = "rgb(255, 0, 0)"
}
$(element).css("background-color", color_to_change)
})
}
function get_all_fields(){
var array = []
var color_to_find = "rgb(255, 0, 0)"
$(".table-bordered tbody td").each(()=>{
let element_color = $(this).css("background-color")
if(element_color == color_to_find){
let element_row = $(this).attr("value")
let element_number = $(this).text()
let required_data = [element_row, element_number]
array.push(required_data)
}
})
}
</script>
{% endblock %}
change_bg不应绑定点击处理程序，因为它是从中调用的onclick。它应该立即更新背景。
function change_bg(element) {
var color_to_change = "rgb(121, 12, 131)"
console.log($(element).attr("value"))
var color_now = $(element).css("background-color")
if (color_now == color_to_change) {
color_to_change = "rgb(255, 0, 0)"
}
$(element).css("background-color", color_to_change)
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句