lowlylove 2022-02-27 06:56 采纳率: 62.5%
浏览 36
已结题

javascript&jQuery——实现角色选择功能

用户选择擅长的游戏角色,可以多选,点击选择按钮时根据用户选中的选项,弹出框显示选择结果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./script/jquery-3.6.0.min.js"></script>
 <script>
        $(function(){
            var $inputs = $('input');
            // console.log($inputs);
            var $btn = $('$btn');
            var btn = $btn[0];
            btn.onclick =function(){
               
                
            }
        })
    </script>
</head>
<body>
    <body>
        <label for="id1">
            <input type="checkbox">战士
        </label>
        <label for="id2">
            <input type="checkbox">法师
        </label>
        <label for="id3">
            <input type="checkbox">射手
        </label>
        <label for="id4">
            <input type="checkbox">坦克
        </label>
        <label for="id5">
            <input type="checkbox">魔法师
        </label>
        <br>
        <button id="btn">选择</button>
    </body>
</html>
 

结果类似下图:

img

展开全部

  • 写回答

1条回答 默认 最新

  • 你好!机器人 2022-02-27 07:15
    关注

    img

    
    $(function(){
    //          var $inputs = $('input');
                // console.log($inputs);
                var $btn = $('#btn');
                var btn = $btn[0];
                var choText = ''
                btn.onclick =function(){
                   var checkedArr = $('input[type="checkbox"]:checked');
                    checkedArr.each(function() {
                        choText += $(this).parent().text() + ' '
                    });
                    alert(choText)
                }
            })
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
编辑
预览

报告相同问题?

问题事件

  • 系统已结题 3月6日
  • 已采纳回答 2月27日
  • 修改了问题 2月27日
  • 修改了问题 2月27日
  • 展开全部

悬赏问题

  • ¥15 fluent设置了自动保存后,会有几个时间点不保存
  • ¥20 激光照射到四象线探测器,通过液晶屏显示X、Y值
  • ¥15 这怎么做,怎么在我的思路下改下我这写的不对
  • ¥50 数据库开发问题求解答
  • ¥15 安装anaconda时报错
  • ¥20 如何用Python处理单元格内连续出现的重复词语?
  • ¥15 小程序有个导出到插件方式,我是在分包下引入的插件,这个export的路径对吗,我看官方文档上写的是相对路径
  • ¥20 希望有人能帮我完成这个设计( *ˊᵕˋ)
  • ¥100 将Intptr传入SetHdevmode()将Intptr传入后转换为DEVMODE的值与外部代码不一致
  • ¥50 基于ERA5数据计算VPD
手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区,与千万技术人共成长

专业的中文 IT 技术社区,与千万技术人共成长

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

客服 返回
顶部