양식을 사용하여 JS를 사용하여 개체를 만든 다음 해당 개체 속성을 가져와 페이지의 테이블에 추가하려고합니다. 여기에 내가 생각 해낸 것이 있지만 그것이 왜 그렇게 행동하는지 이해하지 못합니다. 무언가를 추가하고 싶지만 더 이상은하지 않는 것처럼 깜박입니다.
HTML
<form>
<fieldset>
<legend>Enter the item name.</legend>
<input type="text" id="name" /> </fieldset>
<fieldset>
<legend>Enter the quantity of units needed.</legend>
<input type="number" id="amount" /> </fieldset>
<fieldset>
<legend>Enter the name of the store to buy this from.</legend>
<input type="text" id="store" /> </fieldset>
<button onclick="add()">Add Item</button>
</form>
자바 스크립트
//global variable
var myItem;
//custom object constructor
function Item(name, amount, store) {
this.itemName = name;
this.itemAmount = amount;
this.itemStore = store
}
function add() {
var itemName = document.getElementById("name").value;
var itemAmount = document.getElementById("amount").value;
var itemStore = document.getElementById("store").value;
//creates a new item object and stores it
myItem = new Item(itemName, itemAmount, itemStore);
// Find a <table> element with id="list":
var table = document.getElementById("list");
// Create an empty <tr> element and add it to the 1st position of the table:
var row = table.insertRow(0);
// Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
// Add some text to the new cells:
cell1.innerHTML = "y";
cell2.innerHTML = "y";
cell3.innerHTML = "y";
}
항상 버튼 유형 속성을 정의합니다. 다른 브라우저는 속성이없는 버튼에 다르게 반응합니다. 즉, "제출"처럼 작동하므로 귀하의 경우에는 https://www.w3schools.com/tags/att_button_type.asp 를 버튼에 플래시 (다시로드)했습니다. 라인 추가 유형 = "버튼"
<button type="button" onclick="add()">Add Item</button>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다