zgc24 2021-09-26 12:36 采纳率: 50%
浏览 53
已结题

动态添加组员昵称,一个input框,两个button按钮

一. 需求:
页面中至少有一个input框、两个button按钮,具体样式参考群内截图
输入框内输入昵称,点击“完成添加”按钮会在组员展示中新增一个刚刚添加的组员名
点击继续添加按钮,清空输入框,但要保证组员展示内容不动
昵称中不可以出现逗号、不能输入空格、不可添加重复昵称

二. 思路
①.获取输入框中输入内容,保存在变量当中,以后每次添加都要对变量使用+=操作进行拼接
②.昵称中逗号、空格、重复昵称的判断,可以使用indexOf,如果返回的结果是-1,则表示不存在以上内容
③.组员名称通过拼接保存在变量中时,最好添加逗号进行区分如:小陈,小王,小刘
④.展示时,可通过indexof获取逗号的索引,结合substring或slice,以逗号的索引为终点进行截取然后输入
⑤.④步骤的截取操作只能实现一次,要想对前一次截取部分继续截取,需要使用for循环进行操作

道理都明白,就是实现不了

  • 写回答

2条回答 默认 最新

  • CSDN专家-showbo 2021-09-26 12:55
    关注

    这样?有帮助麻烦点个采纳【本回答右上角】,谢谢~~有其他问题可以继续交流~

    img

    昵称:<input type="text" id="t" /><input type="button" value="完成添加" onclick="addItem()" /><input type="button" value="继续添加" onclick="clearInput()"/>
    <div id="dv"></div>
    <script>
        var t = document.getElementById('t');
        var s = ',';
        function clearInput() { t.value = ''; }
        function addItem() {
            var v = t.value.replace(/[,\s]/gi, '')//去掉逗号,空格
            if (v == '') { alert('昵称不能为空!'); t.focus(); return false; }
            if (s.indexOf(',' + v + ',') != -1) { alert('昵称“'+v+'”已经存在!'); t.select(); return false; }
            s += v + ',' ;
            console.log(s)
            dv.inneaaarHTML = '成员:' + s.replace(/^,|,$/g,'');//正则去掉首尾逗号
            clearInput();
        }
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
    zgc24 2021-09-26 13:46

    多谢,看完之后茅塞顿开

    回复
查看更多回答(1条)
编辑
预览

报告相同问题?

问题事件

  • 系统已结题 10月3日
  • 已采纳回答 9月26日
  • 创建了问题 9月26日

悬赏问题

  • ¥15 怎么修改鸿蒙app的UI及功能设计
  • ¥15 帮我利用jupyter 运行一个正确的代码
  • ¥15 如何使用Gephi软件和Python包中的GephiStreamer交互
  • ¥15 sqlite加密问题咨询
  • ¥15 appdesigner接收不到udp组播的数据
  • ¥15 verilog 非阻塞赋值下的移位拼接错误
  • ¥100 两个按钮控制一个LED
  • ¥15 用C语言写离散数学相关问题
  • ¥30 如何用python的GephiStreamer连接到gephi中,把Python和Gephi的具体操作过程都展示,重点回答Gephi软件的调试,以及如果代码的端口在浏览器中无法显示怎么处理
  • ¥15 ansys机翼建模肋参数
手机看
程序员都在用的中文IT技术交流社区

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

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

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

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

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

客服 返回
顶部