1

I have some elements that I want to hide once document body is clicked. This code came from an answer given in Stack Overflow:

$(document).mouseup(function (e){
    var container = $(".time-stamp, .full-name, .comment-box-wrapper .search-result");
    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // nor a descendant of the container
    {
        container.hide();
    }
});

It works fine but my page displays 10 different articles at a time and each article has textbox (comment-box) which are wrapped in comment-box-wrapper and attached to each articles where users can submit their comments. These comment boxes are set to hidden by default until a user clicks on Comment button. The problem is if a user has entered some text in the comment box and clicks elsewhere, the comment-box gets set to hidden and the content is lost completely.

How can I cancel .hide() if comment-box already has some content in it?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Yax
  • 2,127
  • 5
  • 27
  • 53
  • Add additional check in `if` to check `e.target.value.length ` – Shaunak D Apr 19 '15 at 12:04
  • Sorry, I was in a haste. The `comment-box` is wrapped in `comment-box-wrapper` that is set to hidden. Now I want to dig to `comment-box` and find out if it has content before setting `comment-box-wrapper` to hidden. – Yax Apr 19 '15 at 12:09
  • this might help http://stackoverflow.com/questions/1299424/selecting-empty-text-input-using-jquery – unloco Apr 19 '15 at 12:12
  • @UnLoCo: It didn't help me. I have done some edit on the question. Can you check it again? – Yax Apr 19 '15 at 12:18
  • Can you post your HTML it is a bit unclear what you want. – Michelangelo Apr 19 '15 at 12:18
  • add this code `&& container.find('textarea').val().length == 0` to the `if` condition – unloco Apr 19 '15 at 12:20

1 Answers1

1
$(document).mouseup(function (e){
    var container = $(".time-stamp, .full-name, .comment-box-wrapper.not-active .search-result");
    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // nor a descendant of the container
    {
        container.hide();
    }
});


$('.comment-box').on('change', function(){
    if(this.value!=""){
      $(this).parent().removeClass('not-active');
    }
})
vinayakj
  • 5,591
  • 3
  • 28
  • 48