我有一个应用程序，单击单选按钮后，必须在当前窗口中启用所有小部件。最初，当我启动应用程序时，我在<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
function sortFunction() {
cars.sort(function(a, b) {
return a.year - b.year
});
displayCars();
}
let dropdown = $('#locality-dropdown');
dropdown.empty();
// dropdown.append('<option selected="true" disabled>Choose your Nation</option>');
// dropdown.prop('selectedIndex', 0);
const url = 'http://api.myjson.com/bins/zpaxo';
// Populate dropdown with list of provinces
$.getJSON(url, function(data) {
$.each(data, function(key, entry) {
dropdown.append($('<option></option>').attr('value', entry.abbreviation).text(entry.name));
})
});
/*$(document).ready(function(){
$("#isSelect").click(function () {
alert($('#country').val());
});
$("#selectChina").click(function () {
$("#country").val("China");
});
$("#selectUS").click(function () {
$("#country").val("United State");
});
$("#selectMalaysia").click(function () {
$("#country").val("Malaysia");
});
$("#disableUS").click(function () {
$("#country option[value='United State']").attr("disabled", true);
});
$("#enableUS").click(function () {
$("#country option[value='United State']").attr("disabled", false);
});
});*/
//$(function() {
//var people = [];
//$.getJSON('people.json', function(data) {
$.ajax({
url: url,
dataType: 'json',
type: 'get',
cache: false,
success: function(data) {
$.each(data.person, function(i, f) {
var tblRow = "<tr>" + "<td>" + f.rank + "</td>" +
"<td>" + f.name + "</td>" + "<td>" + f.runScored + "</td>" + "<td>" + f.nation + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
return i < 9;
});
}
});
//})
//});
function onclickbutton() {
document.getElementById("button");
//var searchField = "name";
//$.getJSON('p.json', function(data) {
$.ajax({
url: url,
dataType: 'json',
type: 'get',
cache: false,
success: function(data) {
$.each(data.person, function(i, f) {
//people.sort((a, b) => b.querySelector('.runScored').textContent - a.querySelector('.runScored').textContent);
//var searchVal = document.getElementById("userinput").value;
if (f.name == document.forms["myForm"]["name"].value) {
var tblRow = "<tr>" + "<td>" + f.rank + "</td>" +
"<td>" + f.name + "</td>" + "<td>" + f.runScored + "</td>" + "<td>" + f.nation + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
}
});
}
});
//});
}
function handleSelectChange(event) {
const selectElement = event.target;
const nation = selectElement.options[selectElement.selectedIndex].value;
$.ajax({
url: url,
dataType: 'json',
type: 'get',
cache: false,
success: function(data) {
$("#userdata tbody").html('');
$.each(data.person, function(i, f) {
if (f.nation !== nation) return;
var tblRow = "<tr>" + "<td>" + f.rank + "</td>" +
"<td>" + f.name + "</td>" + "<td>" + f.runScored + "</td>" + "<td>" + f.nation + "</td>" + "</tr>"
$(tblRow).appendTo("#userdata tbody");
return i < 9;
});
}
});
}
</script>
<style>
h1 {
font-size: 30px;
color: #e1e1e1;
padding-top: 12px;
}
body {
background: radial-gradient(ellipse farthest-corner at center top, #f39264 0%, #f2606f 100%);
}
table {
width: 50%;
border-spacing: 0 0;
background: #213B4C;
box-shadow: 0 0 20px #1E3344;
border-radius: 10px;
overflow: hidden;
}
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}
th,
td {
padding: 10px;
text-align: left;
}
table#userdata tr:nth-child(even) {
background-color: #eee;
}
table#userdata tr:nth-child(odd) {
background-color: #fff;
}
table#userdata th {
background-color: grey;
color: black;
}
h4 {
color: black;
}
</style>
</head>
<body>
<div class="leaderboard">
<h1 align="center">
LEADERBOARD
</h1>
<div class="main" align=center>
<select id="locality-dropdown" name="locality" onchange="handleSelectChange(event)">
<option selected="true" disabled>Choose your Nation</option>
<option value="india">India</option>
<option value="lahore">Lahore</option>
<option value="johannesberg">Johannesberg</option>
<option value="colombo">Colombo</option>
<option value="australia">Australia</option>
<option value="dhaka">Dhaka</option>
</select>
<br>
<!--<input type='button' value='Display Selected' id='isSelect'>
<input type='button' value='Select China' id='selectChina'>
<input type='button' value='Select US' id='selectUS'>
<input type='button' value='Select Malaysia' id='selectMalaysia'>
<input type='button' value='Disable US' id='disableUS'>
<input type='button' value='Enable US' id='enableUS'>-->
<h4>Enter your name to get your Rank Here</h4>
<form name="myForm" action="javascript:void(0);" onsubmit="onclickbutton()" method="get">
Name:
<input type="text" name="name">
<input type="submit" value="Submit">
</form>
<br>
<div class="wrapper">
<div class="profile">
<table id="userdata" border="2">
<thead>
<th>Rank</th>
<th>Name</th>
<th>Runs Scored</th>
<th>Nation</th>
</thead>
<tbody>
</tbody>
</table>
</div>
<!--<input id="userinput" type="text" name="searchName">
<button id="button" onclick="onclickbutton()">Search</button>-->
<!--</div>
</div>
-->
</div>
</body>
</html>中有两个单选按钮，并且必须禁用放置在frame1中的所有其他小部件（例如按钮，条目），并且每次单击在frame2上应该启用所有小部件。在此代码中，当我单击radio_button1时，它将激活所有小部件。 是否可以开发一种更好的方法，以便禁用并启用整个框架，而不是启用和禁用每个单独的小部件？以下是我当前的代码：
radio_button1答案 0 :(得分：2)
您应该做的是递归地访问框架的所有子级（及其子级的子级，依此类推，如果（如我）您使用嵌套框架来组织UI），则分别禁用或启用每个子级。< / p>
做到这一点的最佳方法是将ttk.Frame子类化以包含所需的功能：
class dFrame(ttk.Frame):
def enable(self, state='!disabled'):
def cstate(widget):
# Is this widget a container?
if widget.winfo_children:
# It's a container, so iterate through its children
for w in widget.winfo_children():
# change its state
w.state((state,))
# and then recurse to process ITS children
cstate(w)
cstate(self)
def disable(self):
self.enable('disabled')
然后将您的框架创建为dFrame的实例：
self.frame1 = dFrame(self.top,width= 450,height =550)
您可以使用：
self.frame1.enable()
和
self.frame1.disable()
启用/禁用框架中的所有小部件。