问问题
2434 次
2 回答
0
这应该可以满足您的需求:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http-//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Jose Cuervo PBV</title>
<link href="rosters.css" rel="stylesheet" type="text/css" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body>
<img src = "./images/Cuervo_Logo.jpg" alt = "Cuervo PBV Logo" />
<select id='standings' name='standings' onchange="listTeam(this)">
<option value='0'>First Place</option>
<option value='1'>Second Place</option>
<option value='2'>Third Place</option>
<option value='3'>Fourth Place</option>
<option value='4'>Fifth Place</option>
</select>
<select id='leaderBoard' name='leaderBoard' multiple="multiple" size="1" style="width: 300px;" ></select>
<script type="text/javascript">
//put script block at end of body to ensure all other elements have already
//been loaded into the DOM (and therefore exist when we need them to.
//
//"new Array" is not helpful here, so use literal notation instead.
var teams = [
"Jenny Kropp Whitney Pavlik",
"Jennifer Fopma Brooke Sweat",
"Kristen Batt Raquel Ferreira",
"Emily Day Heather Hughes",
"Christal Engle Tealle Hunkus"
],
listTeam = function listTeam(sel) {
var val = document.getElementById('standings').value, //get the selected value
team = teams[val], //get the selected team, based on value
opt = document.createElement('option'), //create an <option> element
lb = document.getElementById('leaderBoard'), //get the leaderBoard select element
children = lb.children.length, //store the number of <option> child elements
child = null, //declare a variable to store an <option> child element
i = 0; //incrementor
opt.innerText = team; //set the innerText
for (i = 0; i < children; i += 1) {
//loop through every child element of leaderBoard
child = lb.children[0]; //store reference to element
lb.removeChild(child); //remove from leaderBoard
}
lb.appendChild(opt); //add new <option> element
};
listTeam(); //call function on initial load as the leaderBoard select element has a selected child
</script>
</body>
</html>
于 2012-11-05T01:51:21.283 回答
0
由于您想将结果放在选项元素中,您可以在您正在使用的函数中执行 innerHTML。所以这看起来像下面这样:
function listTeam(sel) {
var i = document.getElementById('standings').value;
var team = teams[i];
document.getElementById('leaderBoardOptions').innerHTML = team;
}
当然,在选项元素上放一个 id。
<option id="leaderBoardOptions"></option>
也看看这个网站它有一些关于使用innerHTML的很好的解释
于 2012-11-04T23:58:45.387 回答