可编辑div的一些方法总结(二)自定义空格和回车事件

本文总结了在可编辑div中如何处理空格键和回车键的事件,旨在实现空格符的统一( )以及回车键产生的标签标准化。通过监听键盘事件,进行相应的字符替换和文本插入操作,确保页面自适应和浏览器兼容性。
摘要由CSDN通过智能技术生成

在可编辑div中空格键是  和 ‘ ’,混合的,由于浏览器只识别第一个 ‘ ’,所以项目中为了后期页面的自适应以及兼容性,决定将空格符统一为 同样将回车键产生的不同标签替换为统一的
方法:在键盘事件中

 //是否输入回车
            isEnterkey(e);
            //是否输入换行
            isSpacekey(e);

替换回车的方法

/*按下enter 键 编辑框回车事件  插入br换行,更换浏览器默认插入的div*/
    function isEnterkey(e){
   
        if(e && e.keyCode == 13){
            //如果當前是列表
            if($('.TextInner').attr('list-layout') == 'true'){
                //找到li 回车自动加入li
            }else{
                var ev = e || window.event;
                var key = ev.keyCode || ev.charCode;
                var sel, rang, br, fixbr, node, inner, tempRange, offset;
                if(ev.preventDefault) {
                    ev.preventDefault();
                } else {
                    ev.returnValue = false;
                }
                if(window.getSelection) {
                    br = document.createElement('br');
                    sel = window.getSelection();
                    rang = sel.rangeCount > 0 ? sel.getRangeAt(0) : null;
                    if(rang === null) {
                        return false;
                    }
                    rang.deleteContents();
                    node = sel.focusNode;
                    inner = false;
                    while(node.parentNode != document
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值