एचटीएमएल ड्रॉपडाउन के भीतर चेकबॉक्स कैसे प्रदर्शित करें?

मुझे चेक बॉक्स के साथ एक ड्रॉप डाउन सूची (HTML <select></select>) पॉप्युलेट करने की आवश्यकता है। मैंने <div></div> टैग का उपयोग करके ऐसी सूची प्रदर्शित करने और JSP पृष्ठ में कुछ शैलियों को लागू करने का प्रयास किया है, लेकिन यह एक सूची बॉक्स की तरह एक सूची प्रदर्शित करता है। जावास्क्रिप्ट के साथ जेएसपी पेज में कोड नीचे दिया गया है जो केवल उन भाषाओं की सूची को अलर्ट करता है जिन्हें चेक किया गया है जब पृष्ठ पर एकमात्र बटन क्लिक किया जाता है।एचटीएमएल ड्रॉपडाउन के भीतर चेकबॉक्स कैसे प्रदर्शित करें?

<%@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>

यह बस के रूप में निम्नलिखित स्नैप शॉट में दिखाया गया है भाषाओं की सूची प्रदर्शित करता है।

enter image description here

मैं क्या जरूरत है एक बूंद के रूप में भाषाओं की इस सूची दिखाने के लिए नीचे है (न कि किसी सूची बॉक्स के रूप में)। मैं यह कैसे कर सकता हूँ?

स्रोत

2012-02-24 Bhavesh

की तरह, http://code.google.com/p/dropdown-check-list/? – Joe

@JoeTuskan आपको वास्तव में इसे उत्तर के रूप में पोस्ट करना चाहिए। भावेश, जो जो अपनी टिप्पणी के साथ कह रहे हैं वह यह है कि सादा पुराना एचटीएमएल ऐसा नहीं कर सकता ... आपको कुछ जावास्क्रिप्ट जादूगरों को नियोजित करना होगा ... और कुछ अच्छे लोगों ने पहले से ही अधिकांश काम किया है और इसे दुनिया के साथ साझा किया है लिंक जो प्रदान किया। –