DIV与JAVASCRIPT问题，请教

aji19810907 2012-09-05 11:32:28
请教大家一个问题，只想隐藏DIV ID=a1、a2、a3等没有textarea的DIV，可是现在连div id=n1的也隐藏了啊。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<p> 
</p>
<style type="text/css">
ul {width:100%;height:100%;list-style:none; padding:0px; margin:0px;}
li {float:left; height:60px;text-align:center;line-height:60px; padding-top:5px;}
li.b {border-bottom:1px solid #000;border-right:1px solid #000; width:20%; }
li.zhongjian {border-bottom:1px solid #000; width:59%;border-right:1px solid #000; text-align:left; padding-left:6px; }
li.you {
border-bottom:1px solid #000;
width:20%; margin-top:auto;
}
li.b1 {border-right:1px solid #000; width:20%; }
li.zhongjian1 {width:59%;border-right:1px solid #000; text-align:left; padding-left:6px; }
li.you1 {
width:20%; margin-top:auto;
}
td { font-size: 9pt}
.title { font-size: 10.5pt}
.iwhite {
border-left: 1px solid rgb(255,255,255);
border-right: 1px solid rgb(255,255,255);
border-top: 1px solid rgb(255,255,255);
border-bottom:1px solid rgb(0.0,255);
font-family: "Verdana", "Arial", "Helvetica", "sans-serif";
font-size: 9pt; color: #298583;background:#ffffff; font-weight: normal}
.igray {font-family: "宋体";
font-size: 9pt;
color: #000000;
background:#ffffff;
font-weight: normal;
border-bottom: 0px solid #D7E0EC;
border-top: 0px solid #DADBE3;
border-right: 0px solid #DADBE3;
border-left: 0px solid #DADBE3;
}
.igrby {font-family: "宋体";
font-size: 9pt;
color: #000000;
background:#ffffff;
font-weight: normal;
border-bottom: 0px solid #D7E0EC;
border-top: 0px solid #DADBE3;
border-right: 0px solid #DADBE3;
border-left: 0px solid #DADBE3;
}

.tabborder {
border:1px solid #ffffff;
}
.writetd {
text-align:left;
padding:6px;
}

</style>

<table border="0" cellpadding="0" cellspacing="0" style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" width="100%">
<tbody>
<tr>
<td align="middle" height="42" style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px">
<font size="+1"><strong>员工离职审批单</strong></font></td>
</tr>
</tbody>
</table>
<table align="center" border="1" bordercolor="#666666" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="95%">
<tbody>
<tr>
<td bgcolor="#ffffff" colspan="2" style="text-align: center">
公文标题</td>
<td bgcolor="#ffffff" class="writetd" colspan="6">
<input name="文件标题" size="40" /><span style="color: #8b4513">（例：生产部张三的离职申请）</span></td>
</tr>
<tr>
<td class="writetd" style="text-align: center">
姓名</td>
<td class="writetd">
 <input id="3698" name="姓名" size="10" style="width: 70px; height: 18px" /></td>
<td class="writetd" style="text-align: center">
部门</td>
<td class="writetd">
 <input id="3699" name="部门" size="10" style="width: 70px; height: 18px" /></td>
<td class="writetd" style="text-align: center">
入职日期</td>
<td class="writetd">
 <input id="3700" name="入职日期" size="10" style="width: 70px; height: 18px" /></td>
<td class="writetd" style="text-align: center">
交接日期</td>
<td class="writetd">
 <input id="3701" name="交接日期" size="10" style="width: 70px; height: 18px" /></td>
</tr>
<tr>
<td class="writetd" style="text-align: center">
类型</td>
<td class="writetd">
 <input id="3697" name="离职类型" size="10" style="width: 70px; height: 18px" /></td>
<td class="writetd" style="text-align: center">
职务</td>
<td class="writetd" style="text-align: justify">
 <input id="3704" name="职务" size="10" style="width: 70px; height: 18px" /></td>
<td class="writetd" style="text-align: center">
交接人</td>
<td class="writetd">
 <input id="3703" name="交接人" size="10" style="width: 70px; height: 18px" /></td>
<td style="text-align: center">
离职日期</td>
<td class="writetd">
 <input id="3702" name="离职日期" size="10" style="width: 70px; height: 18px" /></td>
</tr>
<tr>
<td bgcolor="#ffffff" colspan="2" style="text-align: center" width="100%">
<div id="n1">
<ul>
<li class="b">离职原因</li>
<li class="zhongjian"><input readOnly type="text" class="igray" id="3998" name="fieldstr6" value=""></li>
<li class="you"></li>
</ul>
</div></td>
</tr>
<tr>
<td colspan="8" style="text-align:center">
<div style="clear:both"></div>
<div id="a1">
<ul>
<li class="b">生活更美好1</li>
<li class="zhongjian"><input readOnly type="text" class="igray" id="3998" name="fieldstr6" value=""></li>
<li class="you"> <input readOnly type="text" class="igray" id="3999" name="fieldstr7" value=""></li>
</ul>
</div>
<div style="clear:both"></div>
<div id="a2">
<ul>
<li class="b">生活更美好2</li>
<li class="zhongjian"><textarea readOnly cols="60" id="4381" name="longstr3" rows="3"></textarea readOnly></li>
<li class="you"> <span></span></li>
</ul>
</div>
<div style="clear:both"></div>
<div id="a3">
<ul>
<li class="b">生活更美好3</li>
<li class="zhongjian"><textarea readOnly cols="60" id="4381" name="longstr3" rows="3"></textarea readOnly></li>
<li class="you"> <input readOnly type="text" id="3999" name="fieldstr7" value=""></li>
</ul>
</div>
<div style="clear:both"></div>
<div id="a4">
<ul>
<li class="b">生活更美好4</li>
<li class="zhongjian"><textarea readOnly cols="60" id="4381" name="longstr3" rows="3"></textarea readOnly></li>
<li class="you"> </li>
</ul>
</div>
<div style="clear:both"></div>
<div id="a5">
<ul>
<li class="b">生活更美好5</li>
<li class="zhongjian"><textarea readOnly cols="60" id="4381" name="longstr3" rows="3"></textarea readOnly></li>
<li class="you"> <input readOnly type="text" id="3999" name="fieldstr7" value=""></li>
</ul>
</div>
<div style="clear:both"></div>
<div id="a6">
<ul>
<li class="b1">生活更美好6</li>
<li class="zhongjian1"><textarea readOnly cols="60" id="4381" name="longstr3" rows="3"></textarea readOnly></li>
<li class="you1"> <input readOnly type="text" id="3999" name="fieldstr7" value=""></li>
</ul>
</div>
<div style="clear:both"></div>

</td>
</tr>
<tr>
<td class="writetd" colspan="4" style="text-align: center">
制单人：<input name="提交人" /></td>
<td class="writetd" colspan="4" style="text-align: center">
制单日期：<input name="提交日期" /></td>
</tr>
<tr>
<td class="writetd" colspan="8">
1、人力资源部每月18日、30日办理员工离职手续相关事宜，其他时间不予办理。<br />
2、员工完成工作交接并完成本人离职手续后方可离职。<br />
3、交接单一式三份，人力资源部、移交人及交接人各一份。</td>
</tr>
</tbody>
</table>
<script type="text/javascript">
window.onload=function(){
var a=document.getElementsByTagName("div");
for(i=0;i<a.length;i++)
{
var b=a[i].getElementsByTagName("textarea");
if(b.length==0)
{
a[i].style.display='none';
}
}
}
</script>
...全文
139 8 打赏 收藏 转发到动态 举报
写回复
用AI写文章
8 条回复
切换为时间正序
请发表友善的回复…
发表回复
泡泡鱼_ 2012-09-05
  • 打赏
  • 举报
 回复
第一步：给你想要判断的div的td给个ID，好精确定位。例如：下面我给了个id为my
<td colspan="8" style="text-align:center" id="my">

  <div style="clear:both"></div>

<div id="a1">   

<ul>   

<li class="b">生活更美好1</li>   

<li class="zhongjian"><input readOnly type="text" class="igray" id="3998" name="fieldstr6" value=""></li>   

<li class="you"> <input readOnly type="text" class="igray" id="3999" name="fieldstr7" value=""></li>   

</ul>   

</div>


第二步：
var a=document.getElementsByTagName("div");
改为：
var a=document.getElementById("my").getElementsByTagName("div");
张运领 2012-09-05
  • 打赏
  • 举报
 回复
DIV ID=a1、a2、a3等没有textarea的DIV?--------代码里只有a1没有textarea

可是现在连div id=n1的也隐藏了啊 ------代码里n1没有textarea

这啥情况？
aji19810907 2012-09-05
  • 打赏
  • 举报
 回复
thanks
泡泡鱼_ 2012-09-05
  • 打赏
  • 举报
 回复
[Quote=引用 4 楼 的回复:]
想请教一下楼上的，有没有直接让表格的TR隐藏的功能呢？
[/Quote]

都给你贴了这么些代码出来了。自己参考做去试吧
张运领 2012-09-05
  • 打赏
  • 举报
 回复
这什么意思？把上面的那个js代码里的div--tr，把textarea--input，这个变化一下，打不动你要的效果吗？两个效果都要的话，复制粘贴，把其中一个这个调换一下就可以了吧
aji19810907 2012-09-05
  • 打赏
  • 举报
 回复
表格中的TR能否实现类似的效果呢？
如果TR中存在INPUT，则显示
如果TR中不存在INPUT，则TR内的代码都隐藏呢？
aji19810907 2012-09-05
  • 打赏
  • 举报
 回复
想请教一下楼上的，有没有直接让表格的TR隐藏的功能呢？
cloudapex 2012-09-05
  • 打赏
  • 举报
 回复
[Quote=引用 1 楼 的回复:]

DIV ID=a1、a2、a3等没有textarea的DIV?--------代码里只有a1没有textarea

可是现在连div id=n1的也隐藏了啊 ------代码里n1没有textarea

这啥情况？
[/Quote]

+1
zepto中使用swipe.js制作轮播图附swipeUp,swipeDown不起效果问题
在移动web开发中，由于手机界面较小，为了能展示更多的图片经常使用轮播图并且还需要考虑到手机流量的问题，通过请教他人以及百度，个人感觉swipe.js比较好用。 它是一个纯javascript工具，不需要跟其它js库一起导入，同时兼容jQuery和zepto，压缩版的大小只有6kb很适合移动端的开发，它的git地址：https://github.com/thebird/swipe 在git上对其的使用方式介绍的相当清楚，关键代码如下 <div id='slider' class='swipe'> <div class='swipe-wrap'> <div>div> <div>
JavaScript实现横线提示输入验证码随输入验证码输入消失的方法
最近做微信端的页面遇到了一个之前没有遇到过的一个页面，刚开始放在那没有去写，可是等其他页面都写好的时候，还是得回过头来研究这个页面问题，刚开始我请教了公司的移动研发，从他那里得到启发，最终实现了这个效果，先把效果图展示出来给大家看看 效果图：   输入验证码   输入完毕   下面就把实现过程奉献给大家 第一步：编写HTML代码 <div class=main-out>

输入企业提供的验证码，即可完成签到

<!--黑色横线框--> <div class=pass-box> <div class=pass-line>
DIV布局和CSS精讲
课程简介： 1，html5编辑器的介绍和使用 2，块标签 3，内联标签 4，超链接和锚点 5，12种选择器 6，颜色 7，单位 8，css属性 9，盒模式 10，div布局 11，内容图片 12，布局图片 13，用户交互图片 14，字体 15，表单...
php鼠标已入移除,javascript - 新人请教个dom操作的问题：鼠标移入/移出父div，子div显示/隐藏。但在鼠标移出父div时，子div却仍然显示？求解...
情况一：当鼠标移入(onmouseover)父级p(红色)时，子p(蓝色)显示(黑点代表鼠标)；情况二：当子p(蓝色)处于显示状态时，把鼠标移动到上面。此时鼠标已经脱离父p(红色)，但子p仍然显示。白色代表鼠标移动轨迹。请问为什么鼠标移出父p(红色)时，为什么子p还能显示(蓝色)？这种表现背后的工作原理是什么样的呢？无标题文档*{margin:0;padding:0;}/*设置父p的样式：宽、高、...
请教一个ArcGIS API for JavaScript编写中一个问题
初学，请问一下ArcGIS API for JavaScript中 请问大佬们，这些功能我为什么使用不了，哪里出错了吗 代码如下 大学 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" style="b...
JavaScript

87,914

社区成员

224,620

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章