Home > Web Front-end > HTML Tutorial > Display the corresponding content through the drop-down box. _html/css_WEB-ITnose

Display the corresponding content through the drop-down box. _html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:24:41
Original
2073 people have browsed it

比如,我有下拉框

<select name="select">    <option>--请选择--</option>    <option value="1">显示内容1</option>    <option value="2">显示内容2</option>    <option value="3">显示内容3</option>  </select>
Copy after login


比如我选择下拉框“显示内容1”,就在右边显示内容1相关的内容。。
比如我选择下拉框“显示内容2”,就在右边显示内容2相关的内容。。

求html代码。。


回复讨论(解决方案)

右边 是什么

右边 是什么

右边就是显示的内容,随便是什么都可以。




















非常感谢。

<!DOCTYPE html><html><head><script>function changeValue(e){if(e.selectedIndex!=0){document.getElementById("showValue").value=e.options[e.selectedIndex].text;}else{document.getElementById("showValue").value='';}}</script></head><body><select name="select" onchange="changeValue(this)">    <option>--请选择--</option>    <option value="1">显示内容1</option>    <option value="2">显示内容2</option>    <option value="3">显示内容3</option>  </select><input type="text" id="showValue" /></body></html>
Copy after login



  


  
  
      
  
  
  
  

如果要设置一个默认显示内容怎么办,比如什么都不选择的时候。。。
显示content0



  


  
  
      
  
  
  
  

比如默认请选择的情况下,下面显示一个默认的内容。?

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template