Getting checkbox value and display a div using jquery or java script

Question

I would like to display a div which is by default is hidden, if checkbox value is "Yes". here is my html code

 <div class="bestsell_wrapper">
    <div style="display:none;" itemprop="best-sell" class="best-sell"></div>
    <input type="checkbox" class="bestsell_chkbox" name="bestsellchk_box"
        value="<%=getCurrentAttribute('item','custitem_sumisho_overlay1')%>" style="display:none;" />  
</div>

There are multiple items and for which the checkbox value is "Yes" i want to display div having class name "best-sell".This jquery code i have tried but its not working

<script type="text/javascript">
    $(".bestsell_chkbox").each(function(){
        if ($("this").val().trim() == "Yes")
        {
            $(".best-sell").css("display", "block");
        }
    });
</script>

Answer 1

Simply change your jQuery to:

$(".bestsell_chkbox").each(function(){
    var $that = $(this);
    if ($that.val().trim() == "Yes") {
        $that.prev(".best-sell").css("display", "block"); 
    }
})

Answer 2

嗨，请执行以下操作

if($(this).val().trim() == "Yes"){

Answer 3

Use this:

 $("input.bestsell_chkbox[type='checkbox']").each(function () {
                if ($(this).attr("checked") !== "checked") {// do your stuff here}
});

Answer 4

You have a few mistakes in your Script. If you want this to show only checkboxes on load this is the code that will get it done.

$(".bestsell_chkbox").each(function(){
    if ($(this).val().trim() == "Yes"){
        $(".bestsell_chkbox").css("display", "block");
    }
});

Your code was trying to show div but your div is already visible. Your checkbox was hidden. That is why I changed the class inside if clause

Answer 5

Use This Code

<script type="text/javascript">
$(document).ready(function () {
    $(".bestsell_chkbox").each(function(){
    if ($(this).attr("checked"))
    {
        $(this).closest('.best-sell').css({'display':'block'});
    }
   });
});
</script>