请高手帮忙看看,能否修改js部份实现自动批量判断输出,谢谢!

qq_783939100 2019-02-21 10:40:38
<!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">;
<head>
<title>无标题文档</title>
<script language="javascript">
function $(obj){return document.getElementById(obj);}
function show(objid) {$(objid).style.display='inline';}
function hidden(objid) {$(objid).style.display='none';}
function doit(){
var sel_val=$('sel').value;
if (sel_val=='') {show('a');hidden('a0');hidden('a1');hidden('a2');hidden('a3');hidden('a4');hidden('a5');hidden('a6');}
if (sel_val==0) {show('a0');hidden('a');hidden('a1');hidden('a2');hidden('a3');hidden('a4');hidden('a5');hidden('a6');}
if (sel_val==1) {show('a1');hidden('a');hidden('a0');hidden('a2');hidden('a3');hidden('a4');hidden('a5');hidden('a6');}
if (sel_val==2) {show('a2');hidden('a');hidden('a0');hidden('a1');hidden('a3');hidden('a4');hidden('a5');hidden('a6');}
if (sel_val==3) {show('a3');hidden('a');hidden('a0');hidden('a1');hidden('a2');hidden('a4');hidden('a5');hidden('a6');}
if (sel_val==4) {show('a4');hidden('a');hidden('a0');hidden('a1');hidden('a2');hidden('a3');hidden('a5');hidden('a6');}
if (sel_val==5) {show('a5');hidden('a');hidden('a0');hidden('a1');hidden('a2');hidden('a3');hidden('a4');hidden('a6');}
if (sel_val==6) {show('a6');hidden('a');hidden('a0');hidden('a1');hidden('a2');hidden('a3');hidden('a4');hidden('a5');}
}
</script>
</head>

<body>
<select name="sel" id="sel" onchange="javascript:doit();">
<option value="">请选择</option>
<option value="0">不要输入框</option>
<option value="1">输入框1</option>
<option value="2">输入框2</option>
<option value="3">输入框3</option>
</select>

<div name="a" id="a" style="display:none;" />?</div>
<div name="a0" id="a0" style="display:none;" /></div>
<div name="a1" id="a1" style="display:none;" />11</div>
<div name="a2" id="a2" style="display:none;" /> 22</div>
<div name="a3" id="a3" style="display:none;" /> 33</div>
<br />
<br />
</body>
</html>


可能还有很多:
<div name="a7" id="a7" style="display:none;" /> 77</div>
<div name="a8" id="a8" style="display:none;" /> 88</div>
……
数量不固定


JS部份怎么能实现不用一行一行加这个:
if (sel_val==6) {show('a6');hidden('a');hidden('a0');hidden('a1');hidden('a2');hidden('a3');hidden('a4');hidden('a5');}
……

比如直接判断选择了 id="a8",js自动show显示 id="a8"的内容,同时屏蔽hidden其它所有<div id=a……> </div>的内容

谢谢!
...全文
1111 25 打赏 收藏 转发到动态 举报
写回复
用AI写文章
25 条回复
切换为时间正序
请发表友善的回复…
发表回复
zfs526049780 2019-02-24
  • 打赏
  • 举报
回复
虚心求教,好多都不会啊,有没有擅长DNF的源码高手?求师傅
nihuan999 2019-02-23
  • 打赏
  • 举报
回复
写的不错呀,学习一下
weixin_44683262 2019-02-23
  • 打赏
  • 举报
回复
求佳能喷墨打印机G1800清零软件。求求求
weixin_44683262 2019-02-23
  • 打赏
  • 举报
回复
求佳能喷墨打印机G1800清零软件
weixin_44683262 2019-02-23
  • 打赏
  • 举报
回复
佳能打印机5B00出错
weixin_41860276 2019-02-22
  • 打赏
  • 举报
回复
看不懂,批量方法那么多
ketty19894 2019-02-22
  • 打赏
  • 举报
回复
hiddenOther();是select不能有空值的。
qq_783939100 2019-02-22
  • 打赏
  • 举报
回复
引用 14 楼 麦草CMS 的回复:
谢谢,新年快乐!
程序员的键盘 2019-02-22
  • 打赏
  • 举报
回复
加上class做标记 <div class="myDiv" name="a" id="a" style="" >?</div> <div class="myDiv" name="a0" id="a0" style="display:none;" >1</div> <div class="myDiv" name="a1" id="a1" style="display:none;" >11</div> <div class="myDiv" name="a2" id="a2" style="display:none;" > 22</div> <div class="myDiv" name="a3" id="a3" style="display:none;" > 33</div>

[...document.getElementsByClassName('myDiv')].forEach(item=>{
if(item.id!='a8')
	item.style.display='none';
else
	item.style.display='block';
});  


纵马饮白虹 2019-02-22
  • 打赏
  • 举报
回复
select 绑定onchange事件,将a01,a02等等一系列的div统一放到一个div下
在select的onchange事件中,根据选择的值拼出要显示的div的id,遍历那个统一的div,除了要显示的元素(id相同),其他的元素都 hidden
ty2244401 2019-02-22
  • 打赏
  • 举报
回复
jquery 可以吗

<!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">
<head>
<title>无标题文档</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script language="javascript">
function doit(){
var sel_val=$("#sel").val();
var selid = "a"+sel_val;
$(".c#"+selid).show().siblings().hide();
}
</script>

</head>
<body>
<select name="sel" id="sel" onchange="javascript:doit();">
<option value="">请选择</option>
<option value="0">不要输入框</option>
<option value="1">输入框1</option>
<option value="2">输入框2</option>
<option value="3">输入框3</option>
</select>

<div>
<div class="c" name="a" id="a" style="display:none;" />?</div>
<div class="c" name="a0" id="a0" style="display:none;" />00</div>
<div class="c" name="a1" id="a1" style="display:none;" />11</div>
<div class="c" name="a2" id="a2" style="display:none;" />22</div>
<div class="c" name="a3" id="a3" style="display:none;" />33</div>
</div>

</body>
</html>
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
<script language="javascript"> 
function $(obj){return document.getElementById(obj);}
function show(objid) {$(objid).style.display='inline';}
function hidden(objid) {$(objid).style.display='none';}
function doit(){
var sel_val=$('#sel').value;
function hiddenOther(sel_val){
var leng = $("#sel").options.length, a = "a";
for(var i = 0; i < leng; i++){
if(i == sel_val){
show(a + sel_val);
}else{
hidden(a + sel_val);
if(sel_val == ""){
show(a);
}else{
hidden(a);
}
}
}
}
hiddenOther(sel_val);
}
</script>
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

<script language="javascript">
function $(obj){return document.getElementById(obj);}
function show(objid) {$(objid).style.display='inline';}
function hidden(objid) {$(objid).style.display='none';}
function doit(){
var sel_val=$('#sel').value;
function hiddenOther(sel_val){
var leng = $("#sel").options.length, a = "a";
for(var i = 0; i < leng; i++){
if(i == sel_val){
show(a + sel_val);
}else{
hidden(a + sel_val);
if(sel_val == ""){
show(a);
}else{
hidden(a);
}
}
}
}
hiddenOther(sel_val);
}
</script>
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
 
<script language="javascript">
function $(obj){return document.getElementById(obj);}
function show(objid) {$(objid).style.display='inline';}
function hidden(objid) {$(objid).style.display='none';}
function doit(){
var sel_val=$('#sel').value;
function hiddenOther(sel_val){
var leng = $("#sel").options.length, a = "a";
for(var i = 0; i < leng; i++){
if(i == sel_val){
show(a + sel_val);
}else{
hidden(a + sel_val);
}
}
if(sel_val == ""){
show(a);
}else{
hidden(a);
}
}
hiddenOther(sel_val);
}
</script>
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
hiddenOther();是select不能有空值的。
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
思路给你了,你不能自己调试?
我最近闲着,在网上看东西。回答一下,就当休息脑子。

<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
<meta charset=utf-8>
<script language="javascript">
function $(obj){return document.getElementById(obj);}
function show(objid) {$(objid).style.display='inline';}
function hidden(objid) {$(objid).style.display='none';}
function doit(){
var sel_val=$('sel').value;
function hiddenOther(sel_val, index){
var leng = $("sel").options.length;
for(var i = 0; i < leng; i++){
if(i == sel_val){
show(index + sel_val);
}else{
hidden(index + i);
}
}
}
function hiddenOther1(sel_val, index){
var leng = $("sel").options.length;
for(var i = 0; i < leng; i++){
if(i == sel_val){
show(index + sel_val);
hidden(index);
}else{
////////////////
alert(i)
hidden(index + i);
if(sel_val == ""){
show(index);
hidden(index + 0);
}
}
}
}
hiddenOther1(sel_val, "a");
}
</script>
</head>

<body>
<select name="sel" id="sel" onchange="javascript:doit();">
<option value="">不要输入框</option>
<option value="0">输入框0</option>
<option value="1">输入框1</option>
<option value="2">输入框2</option>
<option value="3">输入框3</option>
</select>


<div name="a" id="a" style="display:none;" >000</div>
<div name="a0" id="a0" style="display:none;" >0</div>
<div name="a1" id="a1" style="display:none;" >11</div>
<div name="a2" id="a2" style="display:none;" > 22</div>
<div name="a3" id="a3" style="display:inline;" > 33</div>
<br />
<br />
</body>
</html>
qq_783939100 2019-02-21
  • 打赏
  • 举报
回复
<!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">; 
<head> 
<title>无标题文档</title> 
<script language="javascript"> 
function $(obj){return document.getElementById(obj);} 
function show(objid) {$(objid).style.display='inline';} 
function hidden(objid) {$(objid).style.display='none';} 
function doit(){ 
var sel_val=parseInt($('sel').value.trim(), 10); 
function hiddenOther(sel_val){
var leng = $("sel").options.length,  a = "a" + sel_val;
for(var i = 0; i < leng; i++){
    if(i == sel_val){
        show(a);
    }else{
        hidden(a);
    }
}
}
hiddenOther(sel_val);
} 
</script>
</head> 
 
<body> 
<select name="sel" id="sel" onchange="javascript:doit();"> 
<option value="0">不要输入框</option> 
<option value="1">输入框1</option> 
<option value="2">输入框2</option> 
<option value="3">输入框3</option> 
</select> 
 

<div name="a0" id="a0" style="display:none;" >0</div>
<div name="a1" id="a1" style="display:none;" >11</div>
<div name="a2" id="a2" style="display:none;" > 22</div>
<div name="a3" id="a3" style="display:none;" > 33</div>
<br /> 
<br /> 
</body> 
</html> 
还是错误,和空值没关系,你的代码本身不正确!
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
var sel_val=parseInt($('#sel').value.trim(), 10);
麦草CMS 2019-02-21
  • 打赏
  • 举报
回复
var sel_val=parseInt(trim($('#sel').value, 10));
加载更多回复(5)
运行环境:ASP+ACCESS/MSSQL 宝贝儿拍卖系统(BBR)是一套基于ASP+ACCESS和ASP+MSSQL技术的多用户网络拍卖商城购物系统。经过6年的坚持与努力,宝贝儿拍卖系统现已发展成为国内最好的公共拍卖平台,我们将继续努力为大家提供更好,更完善的公共拍卖系统,为中小型企业和个人建设电子商务平台提供最好的解决方案。 宝贝儿拍卖系统v9.6版更新列表: 增加收款帐户功能,方便买家通过线下转帐付款 实现线下转帐付款后也可以在线管理交易订单 除在线余额支付以外,订单还支持了直接转帐给卖家和担保交易两种非在线付款方式 对交易付款流程和资金流向的进行了修改 更新了顶部导航分类推荐的数据调用方式 将商品和店铺相关的链接修改为新窗口打开 更新了站内信新消息的提醒方式 更新了用户登陆注册商品发布的逻辑处理 增加了社区论坛的演示页,避免论坛未启用时的死链接。 删除了部份功能页面整合后产生的多余的文件。 重新整理部份源程序,提高系统稳定性和运行速度。 修正部份CSS和JS代码兼容更多浏览器。 修复了之前版本中存在的一些已知BUG。 BBRv9.6_mssql安装方法 1、将压缩包cnBBRv9.rar解压至本地电脑上的目录内; 2、使用SQLSERVER查询分析器连接至你的MSSQL数据库,打开系统源文件DATA目录下的#1-数据表结构.sql,按F5键执行SQL批量操作。另外,如果需要添加初始化数据,可以再打开#2-初始化数据.sql,同样按F5执行即可。 3、用记事本打开根目录中const.asp按说明修改数据库连接信息; 4、直接上传所有源文件及目录到站点根目录或者子目录中即可; 5、在IE中访问系统首页,看是否运行正常,首页访问地址为:http://你的网站地址/index.asp BBRv9.6_access安装方法 1、将压缩包cnBBRv9.rar解压至本地电脑上的目录内; 2、修改DATA目录的数据库文件名为其它名字(如:#cnBBRv9.asp修改为#cnBBRv9_mine.asp) 3、用记事本打开根目录中const.asp按说明修改Access数据库连接信息,正确连接到数据库; 4、直接上传所有源文件及目录到站点根目录或者子目录中即可; 5、在IE中访问系统首页,看是否运行正常,首页访问地址为:http://你的网站地址/index.asp

87,993

社区成员

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

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