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显示出来

前提假设: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>

温馨提示:答案为网友推荐,仅供参考
第1个回答  2013-11-23

这个很简单就可以实;

首先获取到你传过来的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;  
    }  
}

第2个回答  2013-11-24
<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>: