Question 2682 in Wordpress Question posted in
The official Wordpress documentation can be found here.

jQuery click action before other component load – WordPress

Optimized my website with WP Rocket and delayed javascript execution with some exclusions. Excluded: /jquery-?0-9.(.min|.slim|.slim.min)?.js and js-(before|after) and my script which has code:

jQuery(document).ready(function() {
    console.log('F Loaded');
  jQuery('#div_id').bind('click', function() {
    jQuery('#desired_element').css('display','block');
    console.log('Clicked')
  });
});

When I’m loading a website – getting first message in console "F loaded", but after click – action happens only after all rest scripts are loaded. Is there any way to avoid waiting for all other scripts and make that action (style add after click) immediately ? Tried with plain javascript but got same result.

Tags:

2

Answers


  1. 0

    You can use modern way to write click event outside the document ready you will be able to perform click outside document ready.

    $(document).ready(function() {
    console.log('F Loaded');
});
$(document).on('click', '#div_id', function(event){
    jQuery('#desired_element').css('display','block');
    console.log('Clicked')
});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="div_id">Click me</div>
<div id="desired_element" style="display:none">TEST CONTENT</div>
    Login or Signup to reply.
  2. 0 
    <html>
  <head><title>test</title></head>
  <body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div id="Clickme">Click me</div>
    <div id="Contentsection" style="display:none">Test Content content....</div>
    <script>
    $('#Clickme').on('click', function(event){
        $('#Contentsection').show();
        console.log('Clicked')
    });
    </script>
  </body>
</html>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search