функция onsubmit не загружается должным образом

-1

По какой-то причине не набирает onsubmit. Я не уверен, почему, и я не получаю ошибок. Я проверял орфографические ошибки и пунктуацию, так что я не уверен, что случилось. Любые мысли были бы большой помощью! Большое спасибо!функция onsubmit не загружается должным образом

Вот мой HTML

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>To-Do List</title> 
    <!--[if lt IE 9]> 
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
    <link rel="stylesheet" href="css/form.css"> 
</head> 
<body> 
    <!-- tasks.html --> 
    <form action="#" method="post" id="theForm"> 
     <fieldset><legend>Enter an Item To Be Done</legend> 
      <div><label for="task">Task</label><input type="text" name="task" id="task" required></div> 
      <div><label for="priority">Priority</label> <select name="priority" id="priority"> 
       <option value="high">High</option> 
       <option value="normal" selected>Normal</option> 
       <option value="low">Low</option> 
      </select></div> 
      <input type="submit" value="Add It!" id="submit"> 
     <div id="output"></div> 
     </fieldset> 
    </form> 
    <script src="js/tasks.js"></script> 
</body> 
</html>

Вот Javascript

function Task(name, priority) { 
    'use strict'; 
    this.name = name; 
    this.priority = priority; 
    this.completed = false; 
    this.toString = function() { 
     return this.name + ' (' + this.priority + ')'; 
      }; 
} // End of Task function. 
Window.onload = function(){ 
    'use strict'; 
    var task = document.getElementById('task'); 
    var priority = document.getElementById('priority'); 
    var output = document.getElementById('output'); 
    var tasks = []; 
    document.getElementById('theForm').onsubmit = function() { 
     var t = new Task(task.value, priority.value); 
     tasks.push(t); 
     output.innerHTML = 'There are now <b>' + tasks.length + '</b> item(s) in the to-do list. Just added:<br>' + t.toString(); 
      return false; 
    }; // End of onsubmit anonymous function. 
}; // End of onload anonymous function.

источник

2013-10-15 Heather Mosler

У вас есть 'Window.onload' с капиталом' W', это должно быть 'window.onload' - тогда это будет работать – davidkonrad

Ок, я чувствую себя глупо! благодаря –

Это нормально на самом деле. Когда вы нажимаете кнопку «Отправить», страница перезагружается, поэтому скрипт js также перезагружается. Это как новая чистая страница. Чтобы сделать то, что вы хотите, вы должны заменить вам кнопку:

<input type="submit" value="Add It!" id="submit">

с:

<input type="button" value="Add It!" id="submit" oncick="submit();">

и до этого, вам нужно вызвать ваш JS скрипт и поместить в него:

function submit(){ 
     var task = document.getElementById('task'); 
     var priority = document.getElementById('priority'); 
     var output = document.getElementById('output'); 
     var t = new Task(task.value, priority.value); 
     tasks.push(t); 
     output.innerHTML = 'There are now <b>' + tasks.length + '</b> item(s) in the to-do list. Just added:<br>' + t.toString(); 
      return false; 
    }

И ваша переменная задача должна быть gobal в вашем js-скрипте. Так что ваш файл сценария JS будет выглядеть так:

function Task(name, priority) { 
    'use strict'; 
    this.name = name; 
    this.priority = priority; 
    this.completed = false; 
    this.toString = function() { 
     return this.name + ' (' + this.priority + ')'; 
      }; 
} // End of Task function. 
var tasks = []; 

function submit(){ 
    'use strict'; 
    var task = document.getElementById('task'); 
    var priority = document.getElementById('priority'); 
    var output = document.getElementById('output'); 
     var t = new Task(task.value, priority.value); 
     tasks.push(t); 
     output.innerHTML = 'There are now <b>' + tasks.length + '</b> item(s) in the to-do list. Just added:<br>' + t.toString(); 
      return false; 
    }

И ваш файл .html

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>To-Do List</title> 
    <!--[if lt IE 9]> 
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
    <link rel="stylesheet" href="css/form.css"> 
</head> 
<body> 
<script src="js/tasks.js"></script> 
    <!-- tasks.html --> 
    <form action="#" method="post" id="theForm"> 
     <fieldset><legend>Enter an Item To Be Done</legend> 
      <div><label for="task">Task</label><input type="text" name="task" id="task" required></div> 
      <div><label for="priority">Priority</label> <select name="priority" id="priority"> 
       <option value="high">High</option> 
       <option value="normal" selected>Normal</option> 
       <option value="low">Low</option> 
      </select></div> 
      <input type="button" value="Add It!" id="submit" oncick="submit();"> 
     <div id="output"></div> 
     </fieldset> 
    </form> 

</body> 
</html>

я не проверял.

источник

2013-10-15 15:46:24 Froll

функция onsubmit не загружается должным образом

ответ

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