Проблема с конфликтом jQuery

Question

Я хочу использовать функцию щелчка в Wordpress single. php

, для этого я использовал приведенный ниже код

<div class="wrapper clearfix">
  <a href="#" id="mobile-menu-toggle" class="lines-button">
    <span class="lines"></span>
   </a>
</div>

$(document).ready(function(){
  $('.clearfix a').click(function(){
    alert();

  });
});

, и когда я использую этот код, я получил ошибку Uncaught TypeError: $(...).MagicLiquidizerTable is not a function

Я искал эту ошибку и получил этот и этот код .

и в качестве этого вопроса я пытался

jQuerydocument).ready(function($){
  $('.clearfix a').click(function(){
    alert();

  });
});

и с

$.noConflict();

jQuery(function ($) {
  console.log($); 
});

console.log($);

Я пробовал оба, но он все еще не работает, и снова получил эту ошибку Uncaught TypeError: $(...).MagicLiquidizerTable is not a function.

Кто-нибудь может мне помочь с этим

Answer 1

WordPress поставляется с собственной версией jQuery, вы можете поставить ее в очередь, используя функцию ниже. Он будет добавлен сам по себе, если вы упомянули jquery в качестве зависимости при постановке в очередь другого файла JS.

wp_enqueue_script("jquery");

Многие плагины, используемые в WordPress, используют jQuery вместо $ для безопасного завершения. Если вы хотите использовать $ вместо jQuery, добавьте приведенный ниже код в начало файла или скрипта jQuery.

var $ = jQuery.noConflict();

Вы также можете использовать $ внутри вашего оператора чтения, как показано ниже.

    jQuery(document).ready(function ($) {
        //Your JS Code
     });

Answer 2

Не уверен, как вы настроили html, но если класс clearfix - это div, окружающий href, то он должен работать.

Если вы поместите clearfix класса в href, например <a href="#" class='clearfix'>TEST</a>, он не будет работать или использовать имя класса, например clearfix1, и проверить, работает ли он или нет.

EDIT: У меня есть использовал ваш код выше и это не вызывает ошибок. На остальной части вашей страницы должно быть что-то, что противоречит этому, чего мы не видим в вашем коде. Это, вероятно, имя класса. Я изменил бы имя класса и проверил бы, является ли это конфликтом имени класса первым.

$(document).ready(function(){
  $('.clearfix a').click(function(){
    alert("this works");

  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="wrapper clearfix">
  <a href="#" id="mobile-menu-toggle" class="lines-button">
    <span class="lines">test</span>
   </a>
</div>