Muszę wypełnić listę rozwijaną (HTML <select></select>
) za pomocą pól wyboru. Próbowałem wyświetlić taką listę przy użyciu znacznika <div></div>
i zastosować pewne style na stronie JSP, ale wyświetla ona listę, taką jak pole listy. Poniżej znajduje się kod na stronie JSP wraz z Javascriptem, który alarmuje tylko listę języków, które zostały sprawdzone, gdy kliknięty jest tylko przycisk na stronie.Jak wyświetlić pola wyboru w rozwijanym menu HTML?
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Check box list</title>
</head>
<script type="text/javascript" language="javascript">
function selectCheckBox()
{
var total="";
for(var i=0; i < document.form.languages.length; i++)
{
if(document.form.languages[i].checked)
{
total +=document.form.languages[i].value + "\n";
}
}
if(total=="")
{
alert("select checkboxes");
}
else
{
alert("Selected Values are : \n"+total);
}
}
</script>
<body>
<form id="form" name="form" method="post" action="CheckBox.jsp">
<div style="overflow: auto; width: 100px; height: 80px; border: 1px solid #336699; padding-left: 5px">
<input type="checkbox" name="languages" value="English"> English<br>
<input type="checkbox" name="languages" value="Hindi"> Hindi<br>
<input type="checkbox" name="languages" value="Italian"> Italian<br>
<input type="checkbox" name="languages" value="Chinese"> Chinese<br>
<input type="checkbox" name="languages" value="Japanese"> Japanese<br>
<input type="checkbox" name="languages" value="German"> German<br>
</div>
<br/><input type="button" name="goto" onClick="selectCheckBox()"value="Check">
</form>
</body>
To po prostu wyświetla listę języków, jak pokazano w poniższym snap shot.
Co potrzebne jest, aby pokazać tę listę języków, jak kropla w dół (nie jako listy). Jak mogę to zrobić?
Jak, http://code.google.com/p/dropdown-check-list/? – Joe
@JoeTuskan Naprawdę powinieneś opublikować to jako odpowiedź. Bhavesh, co mówi Joe ze swoim komentarzem to to, że zwykły stary HTML nie może tego zrobić ... musisz użyć odrobiny JavaScriptu ... a niektórzy dobrzy ludzie wykonali już większość pracy i podzielili się nią ze światem link podany przez Joe. –