<style>
.comment-reply-box{
position: relative;
padding: .08rem;
margin-top: .1rem;
background: #F2F2F2;
display:none;
}
.comment-reply-box.show{
display: block;
}
</style>
<p class="live-content">
<p class="hd"><span class="name">小天</span><span class="icon chat-btn"></span><span class="icon like-btn">123</span></p>
<p class="info">以邓小平理论、“三个代表”重要思想、科学发展观为指导,《视频文字》认真贯彻党的十八大、十八届二中、三中、四中、五中全会和习近平总书记系列重要讲话精神。</p>
<p class="comment-list hide">
<p><span>小天:</span>我只有两个意见,增加公务员和事业单位的缴费比例降低药费! <time>1-12 12:49</time></p>
<p><span>小天:</span>我只有两个意见,增加公务员和事业单位的缴费比例降低药费! <time>1-12 12:49</time></p>
<p><span>小天:</span>我只有两个意见,增加公务员和事业单位的缴费比例降低药费! <time>1-12 12:49</time></p>
<p><span>小天:</span>我只有两个意见,增加公务员和事业单位的缴费比例降低药费! <time>1-12 12:49</time></p>
<p class="see-more"><span class="see-more-btn">查看更多</span></p>
</p>
</p>
<p id="comment-reply-box" class="comment-reply-box">
<textarea id="comment-textarea" maxlength="100"></textarea>
<p class="fun">
<span class="tips">最多输入100个字</span>
<a id="confirm-btn" href="#" class="confirm">确定</a>
<span id="cancel-btn" class="cancel">[取消]</span>
</p>
</p>
var $box = $("#comment-reply-box");
if(target.hasClass('chat-btn')){
var liveContent=target.parent().parent()
console.log(liveContent)
console.log($box)
console.log($.contains(liveContent,$box))
if($.contains(liveContent,$box)){
console.log(1232)
if($box.hasClass("show")){
$box.removeClass("show")
}else{
$box.addClass("show")
}
}else{
target.parent().next().after($box);
$box.addClass("show");
}
};
做的是一个二级评论;就是类似于QQ空间那种的评论;当我点击评论按钮时调用评论输入框并且宣示;再次点击时隐藏输入框;输入框在文档中;每次需要的时候才调用;上面是我用jq..contains方法写的;但是发现代码执行的过程中第一个if都是false;但是打印出的都有值
谢邀`
写的有点乱, 建议滤清思路再问.
隐藏输入框
指的是什么. 需求是什么 要实现什么效果补充:
提供一个思路:
初始化显示主体, 点击按钮显示评论, 并且添加一个输入框去发布评论.
可以一次性初始化完, 点击按钮的时候toggle显示隐藏下面的评论(p)即可.
可以点击时发异步请求, 去处理评论p.判断是否有评论, 不要直接对dom进行判断.而要对数据源进行判断.
我看了一下楼主的html,输入框是在html上,并不是js动态添加的,那么你获取“评论”按钮,绑定事件,然后给输入框那个元素调用jq的toggle()方法不就ok了?或者你想一个笨一点的办法,只要你一点击“评论按钮”,判断有没有class=selected,没有就给输入框加一个class名“selected”,然后,输入框调用show()方法。有的话就删掉selected,并输入框调用hide()方法。
比如: