»
Tiếng AnhTiếng PhápTiếng Việt

In - Hộp thông tin cho trình đơn xổ dọc - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Hộp thông tin cho trình đơn xổ dọc
URL: https://www.javascriptbank.com/drop-down-info-box.html

Hộp thông tin cho trình đơn xổ dọc © JavaScriptBank.comBạn có thể dùng đoạn mã này để cung cấp thêm thông tin cho các tùy chọn của một trình đơn xổ dọc.

Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Hộp thông tin cho trình đơn xổ dọc
URL: https://www.javascriptbank.com/drop-down-info-box.html



CSS
<style type="text/css">#form1 {  color: #000;  background:#EFE3C2;  width:200px;  padding: 10px;  display:none;}#form2 {  color: #000;  background:#D9EFC2;  width:200px;  padding: 10px;  display:none;}#form3 {  color: #000;  background:#C2E7EF;  width:200px;  padding: 10px;  display:none;}</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script type="text/javascript">// Created by: Ricom Productions | http://ricom.co.ukfunction selectForm(frm){  // Select the div containing all the hidden forms  var hiddenForms = document.getElementById("allForms");  // Select every form within the above div and assign it to an array  theForm = hiddenForms.getElementsByTagName("form");  // Set the display for each of the above forms to NONE  for(x=0; x<theForm.length; x++){    theForm[x].style.display = "none";  }  // If the form selected from the list exists, set it's display to BLOCK  if (theForm[frm-1]){    theForm[frm-1].style.display = "block";  }}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<form name="selector">  <select id="someID" name="someID" onChange="selectForm(this.options[this.selectedIndex].value)">    <option> Select a Question </option>    <option value="1"> Question 1</option>    <option value="2"> Question 2</option>    <option value="3"> Question 3</option>  </select></form><div id="allForms">  <form id="form1">    This is Question 1. Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues.  </form>  <form id="form2">    This is Question 2. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat.  </form>  <form id="form3">    This is Question 3. Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum.  </form></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->