js程序 下拉框功能,当选择大学下拉框时,隐藏下拉框,将其对应的值,展示到span标签中

js程序 下拉框功能,当选择大学下拉框时,隐藏下拉框,将其对应的值,展示到span标签中

知识点:
获得下拉框中的值和内容

//javascript原生的方法 获取下拉框中的值和内容
    var  myselect=document.getElementById("checkType");
    var index=myselect.selectedIndex ; 

    //拿到选中项options的value
    var v = myselect.options[index].value;
    //拿到选中项options的text
    var t = myselect.options[index].text;

//使用jQuery(需导入)获取选中的项
 var option=$("#checkType option:selected");
 option.val();//获得选中项的值
 option.text();//获得选中项的内容

将span标签设置显示或隐藏

document.getElementById("checkTypeInfo").style.display="";
document.getElementById("checkTypeInfo").style.display="none";

给span标签赋值:

document.getElementById("checkTypeInfo").innerHTML = option.val();

页面代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%@ include file="/back_page/head.jsp" %>




Insert title here







自定义的js运行类库的页面(直接在jsp页面上使用<%@ include file=”/back_page/head.jsp” %>导入即可)
模板代码

/back_page/head.jsp

















<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>

你可能感兴趣的:(JavaScript,js下拉框显示动态span内容)