Как исправить событие нажатия jquery в плагине виджета WordPress?

Question

Я создаю плагин для виджетов wordress ... в моем виджете есть 4 флажка ... когда я нажимаю на первый флажок, который скроет другие 3 флажка. Проблема в том, что jquery не работает. также нет ошибки в консоли. когда я нажимаю «Включить режим доступности» в WordPress Admin, то событие click работает нормально ... Как мне решить эту проблему?

Вот код плагина PHP:

function include_jscript() {
    wp_enqueue_script('myscript', plugins_url('js/script.js',__FILE__ ),array('jquery'));
}
add_action( 'admin_enqueue_scripts', 'include_jscript' );

Вот код jquery:

jQuery(document).ready(function($){ 
$('#chk_site').on('click',function(){
        if($(this).prop("checked") == true)
            $("#chkboxes").hide();
        else
            $("#chkboxes").show();
    }); 
});

<div class="widget-content">	<br><label style="display:block;margin-bottom:6px;"><input type="checkbox" id="chk_site" class="widget-zsearch-2-chk_site" name="widget-zsearch[2][chk_site]" value="">Display post type on site</label><div id="chkboxes"><label style="display:block;margin-bottom:6px;"><input type="checkbox" id="chk_post" class="widget-zsearch-2-post" name="widget-zsearch[2][chk_post]" value="post">Search in Posts</label><label style="display:block;margin-bottom:6px;"><input type="checkbox" id="chk_page" class="widget-zsearch-2-page" name="widget-zsearch[2][chk_page]" value="page">Search in Pages</label><label style="display:block;margin-bottom:6px;"><input type="checkbox" id="chk_attachment" class="widget-zsearch-2-attachment" name="widget-zsearch[2][chk_attachment]" value="attachment">Search in Attachments</label><br></div>	</div>

Answer 1

В вашем коде есть некоторые синтаксические ошибки.Например, это правильный синтаксис оператора js if / else if(arguement){}else{}.Вот рабочее решение,

$(function(){
  $('.chkboxes').on('click', function() {
    if ($(this).is(":checked")){
      $(this).removeClass('chkboxes');
      $(".chkboxes").hide();
      }
    else{
      $(this).show();
      }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<input class='chkboxes'  type="checkbox"/>
<input class="chkboxes"  type="checkbox"/>
<input class="chkboxes"  type="checkbox"/>

<p> click any box to hide the others </p>