jQuery - 隐藏节目在Chrome中无法正常工作(仅播放一次)

时间:2013-06-24 09:49:47

标签: javascript jquery google-chrome show-hide

当点击textarea时,只是写了一个jquery来显示评论按钮。隐藏评论按钮,点击屏幕中的其他位置。 它在Firefox中运行良好。但是在Chrome中它只运行一次。当我再次点击textarea时,提交按钮没有显示,它仍然隐藏。

$(document).on('click', ".comment_txt, .comment_btn", function() {
  var post_id = $(this).attr("post-id");      
  $("#comment_btn_div_"+post_id).show();
});
$('body').click(function() {
  $(".comment_btn").hide()
});


<form class="comment_submit" action="http://localhost:3000/api/v2/posts/48774/comment" data-post-id="48774" id="comment_form_48774">
    <textarea post-id="48774" id="comment_txt_48774" placeholder="Comment" cols="40" rows="1" class="width100 comment_txt"></textarea>
    <div id="comment_btn_div_48774" class="right comment_btn" post-id="48774" style="display:none">
      <button onclick="$(this).text('commenting...')" class="btn btn-small btn-info right" id="comment_btn_48774" type="submit">Comment</button>
    </div>
</form>

不确定为什么这不适用于Chrome。我的页面中有很多表单。所以我点击了身体$(".comment_btn").hide()。为了显示特定的评论按钮,我正在使用此代码$("#comment_btn_div_"+post_id).show();

更新

隐藏评论按钮后,即使我从firebug控制台执行$(“#comment_btn_div_23232”)。show()。它没有显示div。

更新2(使用警报进行测试):

$(document).on('click', ".comment_txt, .comment_btn", function() {
  alert("commenttext area clicked");
  $(".comment_btn").show()
});
$('body').click(function() {
  alert("body clicked");
  $(".comment_btn").hide()
});
  1. 点击textarea,得到提醒a。身体点击了b。点击了commenttext区域。现在显示评论按钮
  2. 点击的身体得到警报a。身体点击。现在注释按钮隐藏
  3. 点击textarea,得到提醒a。身体点击了b。点击了commenttext区域。现在评论按钮未显示
  4. 谢谢!

3 个答案:

答案 0 :(得分:0)

尝试使用模糊

$(document).on('click', ".comment_txt, .comment_btn", function () {
    var post_id = $(this).attr("post-id");
    $("#comment_btn_div_" + post_id).show();
});

$('.comment_txt').blur(function () {
    $(".comment_btn").hide()
});

FIDDLE

答案 1 :(得分:0)

我每隔一段时间都遇到这种情况。还没弄清楚它为什么会发生;它让我感到困惑。我通过使用&#34;显示&#34;的其他方式之一来解决它。 div的。最近,我改变了css显示属性:

$(&#34; #comment_btn_div _&#34 + POST_ID)的CSS(&#39;显示&#39;&#39;块&#39);

答案 2 :(得分:-1)

var post_id=null;
$(document).on('click', ".comment_txt, .comment_btn", function(event) {
  post_id = $(this).attr("post-id");      
   $("#comment_btn_div_"+post_id).show();
   event.stopPropagation();

   $('body').bind("click",function() {
        $("#comment_btn_div_"+post_id).hide()
        $(this).unbind();
   });
});

我希望它对你有用