为了账号安全,请及时绑定邮箱和手机立即绑定

效果没有?是哪里写错了吗??

window.onload = function () {
   //获取元素
    var list=document.getElementById('list');
    //获取元素中的li
     var lis = list.children;
    var timer;
    
     //删除节点
    function removeNode(node) {
        node.parentNode.removeChild(node);
    }
    /*function del(el) {
        var p = el.parentNode;
        p.parentNode.removeChild(p);
    }*/
    
    /**
     * 赞分享
     * @param box 每个分享的div容器
     * @param el 点击的元素
     */
    function praiseBox(box, el){
        var praisesElement = box.getElementsByClassName('praises-total')[0];
        var oldTotal = parseInt(praisesElement.getAttribute('total'));
        var txt = el.innerHTML;
        var newTotal;
        if (txt == '赞') {
            newTotal = oldTotal + 1;
            praisesElement.innerHTML = (newTotal == 1) ? '我觉得很赞' : '我和' + oldTotal + '个人觉得很赞';
            el.innerHTML = '取消赞';
        }
        else {
            newTotal = oldTotal - 1;
            praisesElement.innerHTML = (newTotal == 0) ? '' : newTotal + '个人觉得很赞';
            el.innerHTML = '赞';
        }
        praisesElement.setAttribute('total',newTotal);
        praisesElement.style.display = (newTotal == 0) ? 'none' : 'block';
    }
    /**
     * 发评论
     * @param box 每个分享的div容器
     * @param el 点击的元素
     */
    function replyBox(box/*, el*/) {
        var textarea = box.getElementsByTagName('textarea')[0];
        var list = box.getElementsByClassName('comment-list')[0];
        var li = document.createElement('li');
        li.className = 'comment-box clearfix';
        li.setAttribute('user', 'self');
        var html = '<img class="myhead" src="images/my.jpg" alt=""/>'+
        '<div class="comment-content">' +
        '<p class="comment-text"><span class="user">我:</span>'+ textarea.value + '</p>' +
        '<p class="comment-time">' +
        getTime()+
        /* formateDate(new Date()) +*/
             '<a href="javascript:;" class="comment-praise" total="0" my="0" style="">赞</a>' +
            '<a href="javascript:;" class="comment-operate">删除</a>' +
            '</p>' +
         '</div>'
        li.innerHTML = html;
        list.appendChild(li);
        textarea.value = '';
        textarea.onblur();
    }
    //格式化日期
    function getTime(){
        var t = new Date();
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        var d = date.getDate();
        var h = date.getHours();
        var mi = date.getMinutes();
        m = m < 10 ? '0' + m : m;
        d = d < 10 ? '0' + d : d;
        h = h < 10 ? '0' + h : h;
        mi = mi < 10 ? '0' + mi : mi;
        /*m = m > 9 ? m : '0' + m;*/
        return y + '-' + m + '-' + d + ' ' + h + ':' + mi;
    }
     /**
     * 赞回复
     * @param el 点击的元素
     */
    function praiseReply(el){
        var oldTotal = parseInt(el.getAttribute('total'));
        var my = parseInt(el.getAttribute('my'));
        var newTotal;
        if (my == 0) {
            newTotal = oldTotal + 1;
            el.setAttribute('total', newTotal);
            el.setAttribute('my', 1);
            el.innerHTML = newTotal + ' 取消赞';
        }
        else {
            newTotal = oldTotal - 1;
            el.setAttribute('total', newTotal);
            el.setAttribute('my', 0);
            el.innerHTML = (newTotal == 0) ? '赞' : newTotal + ' 赞';
        }
        el.style.display = (newTotal == 0) ? '' : 'inline-block';
        
    }
/**
     * 操作留言
     * @param el 点击的元素
     */
    function operateReply(el) {
        var commentBox = el.parentNode.parentNode.parentNode;//评论容器
        var box = commentBox.parentNode.parentNode.parentNode;//分享容器
         var textarea = box.getElementsByTagName('textarea')[0];
        var user = commentBox.getElementsByClassName('user')[0]/*.innerHTML*/;
        var txt = el.innerHTML;
        if (txt == '回复') {
            textarea.onfocus();
            textarea.value = '回复' + user.innerHTML;
            textarea.onkeyup();
        }
        else {
            removeNode(commentBox);
        }
    }
    
    
    
    //评论
        var textArea = boxs[i].getElementsByClassName('comment')[0];

        //评论获取焦点
        textArea.onfocus = function () {
            this.parentNode.className = 'text-box text-box-on';
            this.value = this.value == '评论…' ? '' : this.value;
            this.onkeyup();
        }

        //评论失去焦点
        textArea.onblur = function () {
            var me = this;
            var val = me.value;
            if (val == '') {
                timer = setTimeout(function () {
                    me.value = '评论…';
                    me.parentNode.className = 'text-box';
                }, 200);
            }
        }

        //评论按键事件
        textArea.onkeyup = function () {
            var val = this.value;
            var len = val.length;
            var els = this.parentNode.children;
            var btn = els[1];
            var word = els[2];
            if (len <=0 || len > 140) {
                btn.className = 'btn btn-off';
            }
            else {
                btn.className = 'btn';
            }
            word.innerHTML = len + '/140';
        }

     //遍历,把事件代理到每条分享div容器
    for(var i=0; i<lis.length; i++){
        //每一个li(分享)都有点击事件
        lis[i].onclick = function(e){
            //获取触发的元素,对点击时传进的第一个参数也就是事件对象
            e=e||window.event;
            //变量,用来存放触发元素
            var el = e.srcElement;
            //循环  关闭分享
            switch(el.className){
                case 'close':
                    removeNode(el.parentNode);
                    break;
                //赞分享
                case 'praise':
                    praiseBox(el.parentNode.parentNode.parentNode, el);
                    break;
                //回复按钮蓝
                case 'btn':
                    replayBox(el.parentNode.parentNode.parentNode/*, el*/);
                    break;
                //回复按钮灰
                case 'btn btn-off':
                    clearTimeout(timer);
                    break;    
                //赞留言
                case 'comment-praise':
                    praiseReply(el);
                    break;

                //操作留言
                case 'comment-operate':
                    operateReply(el);
                    break;
            }
            
        }
        //输入框
        var textarea = lis[i].getElementsByTagName('textarea')[0];

        textarea.onfocus = function () {
            this.parentNode.className = 'text-box text-box-on';
            this.value = this.value == '评论…' ? '' : this.value;
            this.onkeyup();
        }

        //评论失去焦点
        textarea.onblur = function () {
           var me = this;
            if (this.value == '') {
                timer = setTimeout(function () {
                    me.parentNode.className = 'text-box';
                    me.value = '评论…';
                },400);
            }
        }

        //评论按键事件
        textarea.onkeyup = function (e){
            var len = this.value.length;
            var p = this.parentNode;
            var btn = p.children[1];
            var word= p.children[2];
            if (len ==0 || len > 140) {
                btn.className = 'btn btn-off';
            }
            else {
                btn.className = 'btn';
            }
            word.innerHTML = len + '/140';
        }

    }
        
        
}

正在回答

举报

0/150
提交
取消

效果没有?是哪里写错了吗??

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信