Почему мой код JavaScript не работает?

-3

У меня есть код, который я получил от JSFiddle Почему мой код JavaScript не работает?

$(function() { $('.toggler').click(function() { $(this).find('div').slideToggle(); }); });

<div class="toggler"> This is the title 
<div> This is the content to be toggled </div>

div.toggler { background:lightblue; cursor:pointer; } 
div.toggler div { display:none; }

, что я пытаюсь воспроизвести на своем собственном веб-сайте, однако он не работает. Он отображает все, но при нажатии на него ничего не происходит. Это мой код.

div.toggler { background:lightblue; cursor:pointer; } 
 
div.toggler div { display:none; }

<!DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <link href="design.css" rel="stylesheet" type="text/css" /> 
 
\t \t <script type="text/javascript"> 
 
\t \t \t $(function() { 
 
    \t \t \t $('.toggler').click(function() { 
 
     \t \t \t \t $(this).find('div').slideToggle(); 
 
    \t \t \t \t }); 
 
\t \t \t }); 
 
\t \t </script> 
 
\t </head> 
 
\t <body> 
 
\t \t <div class="toggler"> This is the title 
 
    \t \t <div> This is the content to be toggled </div> 
 
\t \t </div> 
 
\t </body> 
 
</html>

Примечание: Вы также можете увидеть, что код предназначен, чтобы сделать со ссылкой JSFiddle.

источник

2015-08-19 David Loudon

Похоже, вы забыли включить библиотеку 'jQuery' в свой' HTML' –

Вам нужно включить библиотеку jQuery, если вы хотите, чтобы она работала.

<head> 
    <link href="design.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $('.toggler').click(function() { 
       $(this).find('div').slideToggle(); 
      }); 
     }); 
    </script> 
</head>

Также предположение, что разместить script тег с кодом только после того, как все HTML как раз перед закрытием тега тела, так что компиляция JS не мешает рендеринга браузера.

источник

2015-08-19 01:10:40

Конечно, вы должны использовать внешний JavaScript вместо того, чтобы помещать его в свой HTML-код, поэтому он кэшируется в браузере клиента для более быстрого времени загрузки, когда они снова зайдите на свой сайт. – PHPglue

Вы можете использовать googleapis для кэширования jquery. https://developers.google.com/speed/libraries/ – Scramble

Я добавил библиотеку jQuery, где вы предложили и попробовали сценарий в обоих местах (голова и конец тела), но он все еще не работает? –

Почему мой код JavaScript не работает?

ответ

Смежные вопросы