简体   繁体   English

JavaScript的新手-需要帮助,以表单中的数据创建多个对象

[英]New to JavaScript - Need help creating multiple objects with data from a form

I just started learning JavaScript and have been stuck on an assignment for about a week now, I've tried several solutions but every time I add something I break something else. 我刚刚开始学习JavaScript,并且被困在一个星期的作业上,我尝试了几种解决方案,但是每次添加一些东西时,我都会破坏其他东西。 The assignment is to create a form (which I have completed). 任务是创建一个表单(我已经完成)。 The form is to be used to enter data for a new favorite item, when each item is entered it should be displayed on the page and in the console log, as additional items are entered they are added to the list and all items are displayed - 该表格用于输入新收藏夹项目的数据,输入每个项目时,该数据都应显示在页面上和控制台日志中,当输入其他项目时,会将它们添加到列表中并显示所有项目-

Ex - Favorites are: URL: http://oriellyschool.com , title: O'Reilly School, comment: help, tags: school, learning, URL: http://google.com , title: Google, comment: Use google to find info on JavaScript, tags: search, finding info faves:html:133 前-最喜欢的是:URL: http : //oriellyschool.com ,标题:O'Reilly School,评论:帮助,标签:学校,学习,URL: http : //google.com ,标题:Google,评论:使用google查找有关JavaScript的信息,标签:搜索,查找信息收藏:html:133

The specific instructions are to use objects for both all favorites and each new favorite item. 具体说明是对所有收藏夹和每个新收藏夹项目都使用对象。 The functionality to display the favorites (in console and on page) should be included in the methods for the objects. 显示收藏夹的功能(在控制台和页面上)应包含在对象的方法中。

I am able to get the data from the form into a function and had the function to create the favorites working yesterday, not sure what happened this morning. 我能够将表单中的数据获取到函数中,并具有创建收藏夹的功能,该收藏夹昨天运行,不确定今天早上发生了什么。

If someone could please take a look at this and tell me if I am at least heading in the right direction I would appreciate it. 如果有人可以请看一下并告诉我,如果我至少朝着正确的方向前进,我将不胜感激。 I'm just going in circles now. 我现在只是转圈。 (I have tons of console.log statements in the code so I could try to see what it was doing). (我在代码中有大量console.log语句,所以我可以尝试看看它在做什么)。 Thanks! 谢谢!

Code: 码:

 // Function to create entries for favorite items from web form function FaveoriteEntry(url, title, comment, tags) { console.log("In Fave Function"); this.url = url; console.log(this.url); this.title = title; console.log(this.title); this.comment = comment; console.log(this.comment); this.tags = tags; console.log(this.tags); console.log("Have all items"); } //Function to retrieve data from web form and send to function to creat favorite //object. function addFavorite() { var myFavorites = []; console.log("In Function"); var furl = getFavorites.formURL.value; var ftitle = getFavorites.formTitle.value; var fcomment = getFavorites.formComment.value; var ftags = getFavorites.formTags.value; this.clear = getFavorites.reset(); console.log("Entry: " + furl + " " + ftitle + " " + fcomment + " " + ftags); this.createFavorites = function(url, title, comment, tags) { console.log("In Fave Function"); this.url = url; console.log(this.url); this.title = title; console.log(this.title); this.comment = comment; console.log(this.comment); this.tags = tags; console.log(this.tags); console.log("Have all items"); this.string = (this.url + "," + this.title + "," + this.comment + "," + this.tags); myFavorites.push(this.string); var addfavorite = new this.createFavorites(furl, ftitle, fcomment, ftags); console.log(myFavorites); } } 
 body { font-family: Helvetica, Ariel, sans-serif; } form { display: table; border-spacing: 5px; } form p { display: table-row; } form label { display: table-cell; text-align: right; } form input { display: table-cell; } span.comment { font-size: 80%; color: #777777; } span.tags { font-size: 80%; color: rgb(48, 99, 170); } 
 <!doctype html> <html> <head> <title>Advanced JavaScript Project: Favorites and Tags</title> <meta charset="utf-8"> </head> <body> <form name="getFavorites" onsubmit="return favorites(this)"> <h1>Tag and save your favorites</h1> <text></text> <fieldset> <legend>Add a new favorite:</legend> <p> <label>URL:</label> <input type="text" name="formURL" value="" /> <p> <label>Title:</label> <input type="text" name="formTitle" value="" /> </p> <p> <label>Comment:</label> <input type="text" name="formComment" value="" /> </p> <p> <label>Tags:</label> <input type="text" name="formTags" value="" /> </p> <input type="button" name="button" value="Add Link" onClick="addFavorite(this.form)" /> </fieldset> <u1 id="faves-lists"> <h1> List of Favorites</h1> <li>Test -</li> <p> <span class="comments"></span> </p> <p> <span class="tags"></span> </p> </u1> </form> </body> </html> 

put this: 把这个:

var addfavorite = new this.createFavorites(furl, ftitle, fcomment,
            ftags);             
console.log(myFavorites);      

out side of createFavorites function.like this: createFavorites函数的外面。像这样:

function addFavorite() {

    var myFavorites = [];

    console.log("In Function");
    var furl = getFavorites.formURL.value;
    var ftitle = getFavorites.formTitle.value;
    var fcomment = getFavorites.formComment.value;
    var ftags = getFavorites.formTags.value;
    this.clear = getFavorites.reset();
    console.log("Entry: " + furl + " " + ftitle + " " + fcomment + " " + ftags);

    this.createFavorites = function(url, title, comment, tags) {
         console.log("In Fave Function");
         this.url = url;
         console.log(this.url);
         this.title = title;
         console.log(this.title);
         this.comment = comment;
         console.log(this.comment);
         this.tags = tags;
         console.log(this.tags);
         console.log("Have all items");
         this.string = (this.url + "," + this.title + "," + this.comment + "," + 
                        this.tags); 
         myFavorites.push(this.string);          


      }   
    var addfavorite = new this.createFavorites(furl, ftitle, fcomment,
            ftags);             
console.log(myFavorites);  // result here                    
  }              

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM