Почему jQuery не работает в моем проекте?

-2

Я работаю над небольшим проектом для друга. Недавно я узнал о jQuery в Codecademy, и это мой первый раз, когда я включил его в веб-страницу. Однако это не работает, и я не уверен, почему. Кроме того, если кто-то может направить меня на то, как центрировать текстовые поля и т. Д., Чтобы выглядеть как изображение, связанное ниже, пожалуйста, дайте мне знать.Почему jQuery не работает в моем проекте?

screenshot of login form

Вот мой index.html:

<!DOCTYPE html> 
<html> 
    <head> 
    <title>DNA Translator</title> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"/> 
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
    <script> type="text/javascript" src="script.js"</script> 
    <script></script> 
    </head> 
    <body> 
     <div id="content"> 
      <form> 
       DNA: <input type="text" name="dna" placeholder="DNA"><br> 
       mRNA: <input type="text" name="mrna" placeholder="mRNA"><br> 
       tRNA: <input type="text" name="trna" placeholder="tRNA"<br> 
       Amino Acids: <input type="text" name="aminoAcids" placeholder="Amino Acids"<br> 
      </form> 
      <button id="button" type="button">Tanslate</button> 
     </div> 
    </body> 
</html>

Вот мой stylesheet.css:

h2 { 
    font-family:arial; 
} 

form { 
    display: inline-block; 
} 

#content { 
    margin-top: 200px; 
    margin-left: auto; 
    margin-right: auto; 
} 

#button{ 
    opacity: 0.7; 
    display: inline-block; 
    height:25px; 
    width:300px; 
    background-color:#293FE3; 
    font-family:arial; 
    font-weight:bold; 
    color:#ffffff; 
    border-radius: 5px; 
    text-align:center; 
    margin-top:2px; 
    /*display: block;*/ 
    margin: 30px auto; 
} 

input[type="text"] { 
    display:/*block;*/ inline-block; 
    height:20px; 
    padding:4px 6px; 
    margin-bottom:10px; 
    font-size:14px; 
    line-height:20px; 
    color:#555; 
    vertical-align:middle; 
    -webkit-border-radius:4px; 
    -moz-border-radius:4px; 
    border-radius:4px 
    background-color:#fff; 
    border:1px solid #ccc; 
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075); 
    -moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075); 
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.075); 
    -webkit-transition:border linear .2s,box-shadow linear .2s; 
    -moz-transition:border linear .2s,box-shadow linear .2s; 
    -o-transition:border linear .2s,box-shadow linear .2s; 
    transition:border linear .2s,box-shadow linear .2s 
}

Вот это script.js:

$(document).ready(function() { 
    $('#button').mouseenter(function() { 
     $('#button').fadeTo('slow', 1); 
    }); 
    $('#button').mouseleave(function() { 
     $('#button').fadeTo('slow', 0.7); 
    }); 
});

источник

2013-08-08 MacBoss123541

Поскольку вы не загрузили его на свою страницу? – Bergi

Показать код jquery – JTC

Где jQuery? –

Вы закрыть свой сценарий тег слишком рано

<script> type="text/javascript" src="script.js"</script>

Должно быть

<script type="text/javascript" src="script.js"></script>

источник

2013-08-08 18:00:59 Vector

Большое спасибо !!! Это была проблема. Я знал, что делаю что-то глупое. – MacBoss123541

Вы не ed включить jQuery!

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>

источник

2013-08-08 17:55:48 Rob

Это не плагин, это библиотека! – Bergi

Действительно ли нормально загружать jQuery js-файл прямо из ссылки для скачивания? Я думал, что это действительно нужно использовать только для JsFiddle или JsBin и тому подобное. – Zack

'script' не является самозакрывающимся элементом, и я предлагаю удалить атрибут' type'. Также рассмотрим HTTPS. Кроме того, +1. –

Включите ссылку на библиотеку JQuery:

<script src="http://code.jquery.com/jquery-latest.min.js" 
    type="text/javascript"></script>

Убедитесь, чтобы сделать это, прежде чем вызывать какие-либо .js файлы.

источник

2013-08-08 17:56:21 Elmer

Это не плагин, это библиотека! – Bergi

@Bergi да. Спасибо, что исправил меня. – Elmer

Этот центр выравнивания текстовых полей, которые можно сделать с помощью CSS. Если вы хотите использовать jQuery, загрузите его и включите на свою страницу или добавьте напрямую <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>. И тогда вы готовы использовать jQuery. Что вы хотите сделать, если сообщите нам, мы можем что-то предложить.

источник

2013-08-08 18:01:45 deepakb

Я знаю, что могу сделать это с помощью CSS, но я не настолько разбираюсь в CSS, как и вы, и я хотел внести свой вклад в то, как это сделать. – MacBoss123541

Почему jQuery не работает в моем проекте?

ответ

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