私はクラス ".newColor"で一連のdivを持っています。これらのdivの1つがクリックされると、その内容は文字列に変換され、配列にまだリストされていない場合にのみpushメソッドを使用してmyArrayという配列に追加されます。次に、myArrayはクラス ".removeItem"を持つ一連のdivに変換され、水平線の上に表示されます。Javascriptで配列から文字列を取り除く
これらの「.removeItem」divをクリックして、divコンテンツ(その文字列)を追加方法と同様の方法でmyArrayから削除できますか? divsコンテンツを見ると、それを文字列に変換し、配列から文字列を削除します(存在する場合)。
var myArray = [];
var myArrayLength;
var newItem = "";
$(".newColor").click(function() {
newItem = $(this).text();
$('#displayArray').html('');
if(myArray.indexOf(newItem) == -1) {
\t myArray.push(newItem);
myArrayLength = myArray.length;
}
for (var i = 0; i < myArrayLength; i++) {
$('#displayArray').append('<div class="removeItem">' + myArray[i] + '</div>');
}
});
.newColor, .removeItem {
border: 1px solid black;
cursor: pointer;
margin: 2px;
padding: 2px;
display: inline-block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Current array:
<span id="displayArray"></span>
<hr>
Add to array:
<div class="newColor">blue</div>
<div class="newColor">red</div>
<div class="newColor">green</div>
<div class="newColor">orange</div>
<div class="newColor">purple</div>
<div class="newColor">yellow</div>
<div class="newColor">brown</div>
<div class="newColor">pink</div>