comments

功能描述

jQuery带表情包评论插件

快速使用

//从缓存中获取数据并渲染
    let msgBoxList = JSON.parse(window.localStorage.getItem('msgBoxList')) || [];
    innerHTMl(msgBoxList)
    
//点击发表按扭，发表内容
    $("span.submit").click(function () {
        let txt = $(".message").html(); //获取输入框内容
        if (!txt) {
            $('.message').focus(); //自动获取焦点
            return;
        }
        let obj = {
            msg: txt
        }
        msgBoxList.unshift(obj) //添加到数组里
        window.localStorage.setItem('msgBoxList', JSON.stringify(msgBoxList)) //将数据保存到缓存
        innerHTMl([obj]) //渲染当前输入框内容
        $('.message').html('') // 清空输入框

    });
    
//渲染html
    function innerHTMl(List) {
        List = List || []
        List.forEach(item => {
            let str =
                `<div class='msgBox'>
                    <div class="headUrl">
                        <img src='libs/images/tx.jpg' width='50' height='50'/>
                        <div>
                            <span class="title">木林森里没有木</span>
                            <span class="time">2018-01-01</span>
                        </div>
                        <a class="del">删除</a>
                    </div>
                    <div class='msgTxt'>
                        ${item.msg}
                    </div>
                </div>`
            $(".msgCon").prepend(str);
        })
    }

特别说明

是否仍需要帮助？ 请保持联络！
最后更新于 2024/11/18