2012-05-12 1 views
-1

Я пробовал в Firefox, IE и Chrome, и со следующим кодом ни один из моих предупреждений не срабатывает. Либо на pageload, либо когда я нажимаю на изображение. Я чрезвычайно новичок в JavaScript, но по-настоящему ценю силу, которая имеет отношение к пользователю. Мне бы очень хотелось узнать его лучше, и, надеюсь, один из вас может помочь мне понять, почему это не сработает ... Я включу полный HTML-код, поскольку я слышал, что JScript может быть довольно тонким, когда для селекторов и объектов DOM. Я также не имеют ни малейшего представления о том, как правильно бросать ошибки в JavaScript ... :(newbie javascript - предупреждения не срабатывают при загрузке окна

<html> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 

<script type="text/javascript"> 
function preview(img, selection) { 
alert("firedTwo"); 

} 

$(document).ready(function() { 
alert("firedThree"); 
}); 

$(window).load(function() { 
alert("fired"); 
}); 

</script> 

<link href="../css/style.css" rel="stylesheet" type="text/css" /> 
<link href="../css/profile.css" rel="stylesheet" type="text/css" /> 

<link rel="shortcut icon" href="favicon.ico" > 
<link rel="apple-touch-icon" href="apple-touch-icon.png" > 


<title>CityGuru.ca - Saskatoon: Profile Editor</title> 

</head> 

<body> 

<h1>Profile Picture Upload</h1> 

<div id="subHeader">Upload Picture</div> 
<div id="subContainer"> 
     <h2>Create Thumbnail</h2> 
     <div align="center"> 
      <img src="../images/users/saskatoon/1/photo.jpg" style="float: left; margin-right: 10px;" id="thumbnail" alt="Create Thumbnail" /> 
      <div style="border:1px #e5e5e5 solid; float:left; position:relative; overflow:hidden; width:60px; height:60px;"> 
       <img src="../images/users/saskatoon/1/photo.jpg" style="position: relative;" alt="Thumbnail Preview" /> 
      </div> 
      <br style="clear:both;"/> 
      <form name="thumbnail" action="http://saskatoon.CityGuru.ca/includes/profileEditor.php?action=picUpload" method="post"> 
       <input type="hidden" name="x1" value="" id="x1" /> 
       <input type="hidden" name="y1" value="" id="y1" /> 
       <input type="hidden" name="x2" value="" id="x2" /> 
       <input type="hidden" name="y2" value="" id="y2" /> 
       <input type="hidden" name="w" value="" id="w" /> 
       <input type="hidden" name="h" value="" id="h" /> 
       <input type="submit" name="upload_thumbnail" value="Save Thumbnail" id="save_thumb" /> 
      </form> 
     </div> 
    <hr /> 
     <h2>Upload Photo</h2> 
    <form name="photo" enctype="multipart/form-data" action="http://saskatoon.CityGuru.ca/includes/profileEditor.php?action=picUpload" method="post"> 
    Photo <input type="file" name="image" size="30" /> <input type="submit" name="upload" value="Upload" /> 
    </form> 
</div> 



</body> 
</html> 

ПРИМЕЧАНИЕ При использовании веб-консоли Firefox, единственная ошибка JS я получаю $ is not defined

+0

что только ошибка говорит вам много ... –

+1

Вы используете JQuery, но никогда не включать его , Также, как говорили другие, ваш 'script' принадлежит к' head' странице. Прежде чем продолжить, я рекомендую прочитать вводный учебник для JavaScript и jQuery. –

ответ

1

$() синтаксис JQuery, а не родной JavaScript. (Хотя некоторые другие библиотеки используют этот же синтаксис, а) Вам нужно включить JQuery для этой работы

+0

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

+0

@MaurerPower: Какой учебник? Не могли бы вы предоставить ссылку? –

+0

Это был фото-загрузчик, в котором я новичок, но не помню, какой из них. Я попытаюсь найти его снова и повторить.И вызов jQuery был EXACTLY, что я искал! Спасибо огромное! Кроме того, поскольку я изучаю javascript, я очень благодарен вам за то, что вы указываете на проблему синтаксиса, я думал, что это всего лишь родная javascript. Почти все, что я читал, предполагают jQuery или другую библиотеку, я думаю. Еще раз спасибо за помощь и в таком позитивном ключе! – MaurerPower

0

Во-первых, сценарии, как это обычно идут в голову.

во-вторых, вы не должны ставить JavaScript перед DOCTYPE когда-либо.

Третий , Я не вижу тэга с открывающейся головой, только закрывающий тег.

Наконец, вам нужно включить сценарий jquery где-нибудь в голове.

+0

Для этого использования необходимы сценарии JQuery? Пожалуйста, ознакомьтесь с исправлениями по темам, которые я рассмотрел в соответствии с вашими советами. – MaurerPower

+0

Используемые функции $ обычно указывают на использование jquery. Либо избавитесь от функций готовности документа и окна, либо включите jquery. – gcochard

+0

@MaurerPower: jQuery вообще не требуется. Но ** вы пользуетесь им, поэтому вам следует знать, что это такое. Не используйте его, если вы его не понимаете. Потратьте время, чтобы узнать ... –

1

Попробуйте сделать что-то вроде этого:..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html> 

<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
function preview(img, selection) { 
alert("firedTwo"); 

} 
... 

</head> 

важных вещей, чтобы заметить:

  1. Вы не имеете JQuery ссылки: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
  2. Вы Сорт положить вещи из строя ...
+0

Большое вам спасибо за это, это было очень ясно и очень полезно. Я уже принял ответ nymous, и ваш тоже был очень полезен! UPVOTE! – MaurerPower

+0

Слишком плохо, что вы не можете принять оба: P, но рад, что вы получили свой ответ. – sirmdawg

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