基于div显示隐藏不工作
问题描述:
<div id="tabs">
<div id="nav">
<p>Show Div 1:<input type="radio" name="tab" value="pkfrom" class="div1" /></p>
<p>Show Div 2:<input type="radio" name="tab" value="pkfrom" class="div2" /></p>
</div>
<div id="div1" class="tab">
<? echo form_open('email/send');?>
<table width="100%">
<tr><td>
Username:</td><td><? echo form_input('username', 'your username');?></td></tr>
<tr><td> Name:</td><td> <? echo form_input('Name', '');?></td></tr>
<tr><td> Address:</td><td> <? echo form_textarea('address', '');?></td></tr>
<tr><td> Degree:</td><td> <? echo form_input('specialist', '');?></td></tr>
<tr><td> Degree:</td><td> <? echo form_input('specialist', '');?></td></tr>
<? echo form_close();?>
</table>
</div>
<div id="div2" class="tab">
<p>this is div 2</p>
</div>
</div>
<script type="text/javascript" charset="utf-8">
(function(){
var tabs =document.getElementById('tabs');
var nav = tabs.getElementsByTagName('input');
/*
* Hide all tabs
*/
function hideTabs(){
var tab = tabs.getElementsByTagName('div');
for(var i=0;i<=nav.length;i++){
if(tab[i].className == 'tab'){
tab[i].className = tab[i].className + ' hide';
}
}
}
/*
* Show the clicked tab
*/
function showTab(tab){
document.getElementById(tab).className = 'tab'
}
hideTabs(); /* hide tabs on load */
/*
* Add click events
*/
for(var i=0;i<nav.length;i++){
nav[i].onclick = function(){
hideTabs();
showTab(this.className);
}
}
})();
</script>
</div>
这是基于div显示和隐藏的编码。但它只适用于如果我只是在div中键入正常文本。但是,如果我添加PHP或任何HTML元素,它不起作用。基于div显示隐藏不工作
任何想法如何纠正它。
感谢
答
我修改了一点,它似乎为我工作: 我修改了以下 -
if(tab[i].className == 'tab'){
document.getElementById('div' + i).style.display = 'none';
}
和
function showTab(tab){
document.getElementById(tab).style.display = 'block';
}
+0
它不适合我 – user2008654 2013-02-25 09:10:46
检查你broncode,确实有mabye 2乘以身体标签或其他东西。因为它没有关系,或者你有来自php的文本,或者你输入文本 – Perry 2013-02-25 07:28:56
控制台中的任何错误?生成的HTML如何? – hank 2013-02-25 07:29:49