| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 3003 人关注过本帖
标题:设计一个有多组复选框checkbox 的页面,单击“复选框”按钮,输出页面中所有 ...
只看楼主 加入收藏
li71
Rank: 1
等 级:新手上路
帖 子:32
专家分:0
注 册:2018-9-8
结帖率:100%
收藏
已结贴  问题点数:20 回复次数:3 
设计一个有多组复选框checkbox 的页面,单击“复选框”按钮,输出页面中所有的被选中的checkbox的值和提示文字
求大佬解答 急  
搜索更多相关主题的帖子: 复选框 checkbox 页面 提示 文字 
2018-11-03 16:58
林月儿
Rank: 16Rank: 16Rank: 16Rank: 16
来 自:湖南
等 级:版主
威 望:138
帖 子:2277
专家分:10647
注 册:2015-3-19
收藏
得分:10 
对复选框绑定点击事件,然后在函数体获取选中状态。可以查一下js的dom操作api

剑栈风樯各苦辛,别时冰雪到时春
2018-11-06 00:18
icecool
Rank: 9Rank: 9Rank: 9
等 级:贵宾
威 望:20
帖 子:1216
专家分:1376
注 册:2005-3-14
收藏
得分:10 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
<style>
table{
border-collapse:collapse;
border: 1px solid #ffffff;
width: 100%;
        }
span{background:#ff00bb;cursor: pointer; }
td.left{ width:30%;background:#99dd33;}
td.right{ width:70%;background:#CCCC33;}
</style>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){

                      $("span").click(function(){
                                         $("#txt_div").html( "显示数据:<br>");
                                         $("input[name='chk']:checked").each(function() {
                                                        $("#txt_div").append($(this).val() + "<br>");
                                          });
                       });
});
</script>
</head>
<body>
<table>
<tr><td class="left">
<input name=chk type="checkbox" value="1">a1<br>
<input name=chk type="checkbox" value="2">a2<br>
<input name=chk type="checkbox" value="3">a3<br>
<input name=chk type="checkbox"value="4">a4<br>
<input name=chk type="checkbox" value="5">a5<br>
<input name=chk type="checkbox" value="6">a6<br>
<input name=chk type="checkbox" value="7">a7<br>
<input name=chk type="checkbox"value="8">a8<br>
<span id="span1">确定</span>
</td>

<td class="right">
<div id="txt_div">显示数据:<br></div>
</td><tr>
</table>
</body>
</html>

http://toorup.3v.do
loading...
2018-11-06 16:48
icecool
Rank: 9Rank: 9Rank: 9
等 级:贵宾
威 望:20
帖 子:1216
专家分:1376
注 册:2005-3-14
收藏
得分:0 
要弹出提示改为下面这里:
程序代码:
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
                      $("span").click(function(){
                                         var txt_str="已选内容为:";
                                         $("#txt_div").html( "显示数据:<br>"); 
                                         $("input[name='chk']:checked").each(function() { 
                                                        $("#txt_div").append($(this).val() + "<br>"); 
                                          txt_str = txt_str + $(this).val() + ";";   //准备弹出内容
                                          });
                          alert(txt_str);//这里弹出提示
                       });
});
</script>

http://toorup.3v.do
loading...
2018-11-06 16:59
快速回复:设计一个有多组复选框checkbox 的页面,单击“复选框”按钮,输出页面 ...
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.014783 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved