jquery не работает над файлом html

Когда я загружаю html-файл в свой веб-браузер (chrome), файл css работает, но анимация jQuery не работает. Я не могу понять, что не так. Кстати, я очень новичок в кодировании.jquery не работает над файлом html

<!DOCTYPE html> 
    <html> 
     <head> 
      <title>Button Magic</title> 
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
      <link type="text/css" rel="stylesheet" href="stylesheet.css"/> 
     </head> 
     <script>  
     $(document).ready(function() { 
      $('div').click(function() { 
       $(this).fadeOut('slow'); 

       }); 
      }); 
     }); 

     </script> 
     <body> 
     <div> 

     </div> 


    </body> 
</html> 


div { 
    height: 50px; 
    width: 120px; 
    border-color: #6495ED; 
    background-color: #BCD2EE; 
    border-width: 2px; 
    border-style: solid; 
}

источник

2016-01-13 Shaheer Saif

Попробуйте поместить тег 'script' в раздел' head' вашего HTML? – faino

У вас есть дополнительное закрытие '})' в вашем Javascript – Vince

Проблема заключается в дополнительном кронштейне});

<!DOCTYPE html> 
    <html> 
     <head> 
      <title>Button Magic</title> 
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
      <link type="text/css" rel="stylesheet" href="stylesheet.css"/> 
     </head> 
     <style> 
     div { 
      height: 50px; 
      width: 120px; 
      border-color: #6495ED; 
      background-color: #BCD2EE; 
      border-width: 2px; 
      border-style: solid; 
     } 
     </style> 
     <script>  
     $(document).ready(function() { 
      $('div').click(function() { 
       $(this).fadeOut('slow');    
      }); 
     }); 

     </script> 
     <body> 
     <div> 

     </div> 


    </body> 
</html>

источник

2016-01-13 02:16:41

Спасибо! Я избавился от лишнего}); и смените скрипт src на http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js, так как мой html-файл запускался локально. –

У вас есть дополнительная закрывающая скобка и скобки в вашем Javascript (});). Кроме этого, я думаю, что ваш код работает нормально.

... Сохраненный подсветкой синтаксиса :) ...

источник

2016-01-13 02:26:43 Vince

Первый выезд ваш JQuery работает,

<script> 
$(document).ready(function(){ 
    alert(" "); 
}); 
</script>

затем делать то, что вы хотите, это полный код, HTML, CSS и js (надеюсь, что ваша связанная библиотека jquery не работает. И лучше использовать всегда внешние css и js).

<!DOCTYPE> 
<html> 
<head> 
    <title></title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 

</head> 
<body> 

    <div class="yourdiv" style="width:100px;height:100px;background-color:black;"> 

    </div> 

<script type="text/javascript"> 
    $("div.yourdiv").click(function(){ 
    $(this).fadeOut(1000); // this 1000 means within this ms it fadeOut. and this keyword says div.yourdiv 
    }); 
</script> 
</body> 
</html>

источник

2016-01-13 04:31:06

Вот ваше решение

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Button Magic</title> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
     <style> 
      div { 
       height: 50px; 
       width: 120px; 
       border-color: #6495ED; 
       background-color: #BCD2EE; 
       border-width: 2px; 
       border-style: solid; 
      } 
     </style> 
     <script> 
      $(document).ready(function() { 
       $('div').click(function() { 
        $(this).fadeOut('slow'); 

       }); 
      }); 
    // }); 
    // Remove or hide above extra brackets. 

     </script> 
    </head> 

    <body> 
     <div> 
     </div> 
    </body> 
</html>

Удалить дополнительный закрывающую скобку в сценарии }); Поместите <script> блок в головной части и скопировать CSS из DIV в <style> блока в головной части. проверить подлинник. Я надеюсь, что это сработает для вас.

источник

2016-01-13 04:56:46

jquery не работает над файлом html

ответ

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