如何從HTML輸入中獲取多個值？

我正在關注的流星Tuturial（https://www.meteor.com/tutorials/blaze/creating-an-app）這裏是HTML的部分和JavaScript代碼：如何從HTML輸入中獲取多個值？

HTML

<body> 
    <div class="container">`enter code here` 
    <header> 
     <h1>Todo List</h1> 

     <form class="new-task"> 
     <input type="text" name="text" placeholder="Type to add new tasks" /> 
     </form> 

    </header> 

    <ul> 
     {{#each tasks}} 
     {{> task}} 
     {{/each}} 
    </ul> 
    </div> 
</body>

的JavaScript

Template.body.events({ 
    "submit .new-task": function (event) { 
     // Prevent default browser form submit 
     event.preventDefault(); 

     // Get value from form element 
     var text = event.target.text.value; 

     // Insert a task into the collection 
     Tasks.insert({ 
     text: text, 
     createdAt: new Date() // current time 
     }); 

     // Clear form 
     event.target.text.value = ""; 
    } 
    });

我想知道如何添加HTML表單中的另一個輸入並訪問Java腳本中的另一個輸入。

例如：

<input type="text" name="city" placeholder="Type to add city" />

來源

2016-02-19 user3675868

如果您插入例如輸入到你的HTML新的JavaScript應該是：

Template.body.events({ 
"submit .new-task": function (event) { 
    // Prevent default browser form submit 
    event.preventDefault(); 

    // Get value from form element 
    var text = event.target.text.value; 
    var city = event.target.city.value; 

    // Insert a task into the collection 
    Tasks.insert({ 
    text: text, 
    createdAt: new Date() // current time 
    }); 
    Tasks.insert({ 
    text: city, 
    createdAt: new Date() // current time 
    }); 

    // Clear form 
    event.target.text.value = ""; 
    event.target.city.value=""; 
}

來源

2016-02-19 21:50:05 Aplet123

我這樣做，但現在當我在瀏覽器中測試它，輸入不起作用。 @ Aplet123 – user3675868

如何從HTML輸入中獲取多個值？

回答

相關問題