如何使用javascript隐藏/显示基于变量的div [英] How to hide/show div based on variable using javascript
本文介绍了如何使用javascript隐藏/显示基于变量的div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想根据网址参数显示div。我只能使用html css和javascript。
I am trying to display a div based on the URL parameter. I have to use only html css and javascript. I got it working until the part where the div must be set to display none if the variable (parameter from URL) matches.
HTML
<div id="cfiblinks">
<div class="row">
<div class="twelve columns">
<ul class="nav-bar">
<li>
<a href="#" target="_blank">
<span>Order Document Upload</span>
</a>
</li>
<li>
<a href="#" target="_blank">
<span>Business Card History</span>
</a>
</li>
<li>
<a href="#" target="_blank">
<span>Material Inventory</span>
</a>
</li>
</ul>
</div>
</div>
</div>
Javascript
Javascript
<script language="JavaScript">
function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[""])[1].replace(/\+/g, '%20'))||null
}
myvar = getURLParameter('UserGroupId');
document.write('The url parameter is: ' + myvar +' ');
if (myvar == 10102) {
document.write('The url parameter is: ' + myvar +' ');
document.getElementById('cfiblinks').style.visibility = 'visible';
} else {
document.write('The url parameter is not : ' + myvar +' ');
document.getElementById('cfiblinks').style.visibility = 'hidden';
}
</script>
任何帮助将非常感谢。我怀疑document.getElementById有问题。
Any help would be greatly appreciated. I suspect something is wrong with the document.getElementById.
推荐答案
可以使用block或none设置display属性。 >
You can set the display property using block or none.
document.getElementById('cfiblinks').style.display = 'block'; //Will show
document.getElementById('cfiblinks').style.display = 'none'; //Will hide
这篇关于如何使用javascript隐藏/显示基于变量的div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文