JavaScriptを使用して配列をグラフィカルに削除する

これを行う方法がわかりません。私は表示される配列に自分の情報を入れようとしており、常にがになるようにしています。私はそれを行うにはどんな素敵な簡単な方法がありますJavaScriptを使用して配列をグラフィカルに削除する

、1またはマウスを指して、それを削除して検索することにより、いずれか、それに特定のエントリを削除するヘルプが必要ですか。

<!doctype html> 
<html lang="sv"> 
<body> 
<head> 
<meta charset="UTF-8"> 
</title> 
</head> 
<body> 
    <input type="text" placeholder="Förnamn" id="name" autofocus> 
    <input type="date" id="pnummer" autofocus> 
    <input type="text" placeholder="Efternamn" id="enamn" autofocus> 
    <input type="button" value="mata in" onclick="register()"> 
    <input type="button" value="visa" onclick="show()"> 

<script type="text/javascript"> 
array=[] 

function register() 
{ 
var fnamn = document.getElementById("name").value; 
var enamn = document.getElementById("enamn").value; 
var pnummer = document.getElementById("pnummer").value; 
var p1 = new Person(fnamn,pnummer,enamn); 
array.push(p1); 

} 
function Person(fnamn, pnummer, enamn) 
{ 
this.fnamn=fnamn; 
this.pnummer=pnummer; 
this.enamn=enamn; 
this.visa=function() 
{ 
    var panel ="Förnamn:"+" "+this.fnamn+" "+"Efternamn:"+" "+this.enamn+" "+"Personnummer:"+" "+this.pnummer+"<br>"; 
    return panel; 
} 
} 

function show(){ 
var showperson=document.getElementById("new"); 
showperson.innerHTML=""; 
var i=0; 
while (array.length>i) 
    { 
    showperson.innerHTML+=array[i].visa() 
    i++; 
    } 
} 
</script> 

<p id="new"></p> 
<div id="panel"></div> 
</body> 
</html>

出典

2016-05-26 Lukas

配列が取得-行く、あなたが望むように、彼らが成長することができます意味から動的です:)おかげで、私が探していた答えを持っていました。配列から要素を削除するまで、Checkout [Array＃splice（）]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice） – nem035

私はjQueryはあなたのクリック<div>のインデックスを見つけて、次の関数のようなものを持つ要素を削除することができ、オプションである：

$("div.someIdYouGiveIt").click(function() { 
    var index = $("div.someClassYouGiveIt").index(this); 
    array.splice(index, 1); 
});

出典

2016-05-26 14:51:01

私はあなたがしているものは100％を確認していません何をしようとしているのか、それらの言葉のいくつかは何を意味しているのですか？

var peopleTracker = {}; 
 
var peopleCounter = 0; 
 

 
function addPerson() 
 
{ 
 
    // get the values 
 
    var firstName = document.getElementById("firstName").value.trim(); 
 
    var lastName = document.getElementById("lastName").value.trim(); 
 
    var birthday = document.getElementById("birthday").value.trim(); 
 
    
 
    // make sure none are blank 
 
    if(firstName == "" || lastName == "" || birthday == "") return; 
 
    
 
    // give each person an ID so we can remove them later 
 
    var personID = ++peopleCounter; 
 
    
 
    peopleTracker[personID] = { 
 
     "firstName" : firstName, 
 
     "lastName" : lastName, 
 
     "birthday" : birthday 
 
    }; 
 
    
 
    // add the person to the table 
 
    var row = document.getElementById("peopleList").insertRow(); 
 
    row.insertCell().innerText = firstName; 
 
    row.insertCell().innerText = lastName; 
 
    row.insertCell().innerText = birthday; 
 
    row.insertCell().innerHTML = '<a href="#" onclick="removePerson(this.parentNode.parentNode, ' + personID + '); return false">remove</a>'; 
 
} 
 

 
// delete a user from the tracker and remove the row 
 
function removePerson(row, personID) 
 
{ 
 
    delete peopleTracker[personID]; 
 
    row.parentNode.removeChild(row); 
 
}

<!doctype html> 
 
<html lang="sv"> 
 
    <head> 
 
    <meta charset="UTF-8"> 
 
    <title>the dingo ate my baby</title> 
 
    </head> 
 
    <body> 
 
    <input type="text" placeholder="First Name" id="firstName" autofocus> 
 
    <input type="text" placeholder="Sur Name" id="lastName" autofocus> 
 
    <input type="date" id="birthday" autofocus> 
 
    <input type="button" value="Add Person" onclick="addPerson()"> 
 
    <br /><br /> 
 
    <table border="1"> 
 
     <thead> 
 
      <tr> 
 
      <th>First Name</th> 
 
      <th>Sur Name</th> 
 
      <th>Birthday</th> 
 
      <th>Action</th> 
 
      </tr> 
 
     </thead> 
 
     <tbody id="peopleList"></tbody> 
 
    </table> 
 
    </body> 
 
</html>

いくつかの考え：

削除する配列を使用するつもりなら、あなたのことができるようにするためにいくつかのユニークなIDを使用する必要があるとしていますあなたが削除したい人を見つけてください。配列indexを使用することはできません。これは、配列から人を削除するときに変更されるためです。
オブジェクトを使用してユーザーを格納すると、追加されたユーザーごとに変更される一意のIDを使用して削除できます。

出典

2016-05-26 14:54:00 IMTheNachoMan

ありがとう!!まさに私が望んでいた、感謝！ :) – Lukas

IMTheNachoManは、誰もがJSで

出典

2016-05-26 15:01:34 Lukas

JavaScriptを使用して配列をグラフィカルに削除する

答えて

関連する問題