Question

url传递参数，js控制指定页面div的显示与隐藏

假设现在有a.jsp页面
<select>
<option value="A" >A</option>
<option value="B" >B</option>
<option value="C" >C</option>
</select>
<input type="button" value="查找" />

还有b.jsp页面,其中下面的div都默认隐藏
<div id="A" ></div>
<div id="B" ></div>
<div id="C" ></div>

假设我选择A后点击”查找“，把‘A’这个值通过url传递给b.jsp页面
然后用js获取到这个值‘A’，让b页面的id=“B”的div显示出来要怎么做？
额。。写错了，是让id=“A”的div显示出来

Answer 1

前提假设：a.jsp页面中的select组件的name属性是name="mySelect"

问题分析，其实你既然是通过动态语句编写的网页，为什么要费那么大力气去通过JS解析URL参数呢，你可以直接通过request对象，获取到对应的请求参数就可以了。比通过JS解析更准确更方便，具体，你可以这样做：

1、在b.jsp页面中定义一个js变量，用于接收传递过来的参数：

var selectValue = "<%=request.getParameter("mySelect")%>";

2、在window.onload事件中来控制对应元素的显示与隐藏：

window.onload=function(){
    var el = document.getElementById(selectValue);
    if (el) {
    	// 将对应ID的元素设置为可见
    	el.style.display = "block";
    }
}

完整脚本代码：

<script type="text/javascript">
// 定义一个js变量接收传递过来的参数
var selectValue = "<%=request.getParameter("mySelect")%>";
window.onload=function(){
    var el = document.getElementById(selectValue);
    if (el) {
    	// 将对应ID的元素设置为可见
    	el.style.display = "block";
    }
}
</script>

Answer 2

这个很简单就可以实；

首先获取到你传过来的A，然后做下判断就可以了！

window.onload = function(){
    var a = //获取传过来的A;
    var div = document.getElementById(a).style.display = "block";
}

追问

var a = //获取传过来的A;
这句还是很纠结
怎么从url获取过来呢

追答

我简单给你写个方法吧！

function request(paras){ 
    var url = location.href;  
    var paraString = url.substring(url.indexOf("?")+1,url.length).split("&");  
    var paraObj = {}  
    for (i=0; j=paraString[i]; i++){  
    paraObj[j.substring(0,j.indexOf("=")).toLowerCase()] = j.substring(j.indexOf("=")+1,j.length);  
    }  
    var returnValue = paraObj[paras.toLowerCase()];  
    if(typeof(returnValue)=="undefined"){  
    return "";  
    }else{  
    return returnValue;  
    }  
}

Answer 3

<s:if test="#select =='A' ">
<div id="A" ></div>

</s:if>:
<s:if test="#select =='b' ">
<div id="B" ></div>

</s:if>:

<s:if test="#select =='c' ">
<div id="C" ></div>

</s:if>: