0

ボタンがクリックされたときにテキスト ボックスを動的に作成するコードがいくつかありますが、getElementByClassName を使用してテキスト ボックスの値を取得し、すべての「listitem」テキスト フィールドを配列に取得します。ループして各要素の値 (ユーザーが入力したものなど) を見つけ、それらの値を配列に入れます。次に、その配列をソートします。後でそれらを表示します...どんな助けも歓迎されます!

Javascript:

var $ = function (id)
{
  return document.getElementById(id);
}

var sortItem = function ()
{
  var myDisplayItems = "";
  myDisplayItems.innerHTML = "";

  var myClassTag = document.getElementsByClassName("listitem");
  for (index in myClassTag)
  {
    myDisplayItems += "<br>" + myClassTag[index];
  }
  //sort Array

 }
 var addItem = function()
 {
 var myToDoList = $("todolist");

  var myInput = document.createElement("input");
  myInput.setAttribute("type", "text");
  myInput.setAttribute("class", "listitem");
  myToDoList.appendChild(myInput);

  var myBr = document.createElement("br");
  myDoToList.appendChild(myBr);
 } 

 window.onload = function ()
 {
   $("additem").onclick = addItem;
   $("sortitems").onclick = sortItem;   
 }

HTML:

  <body>
  <h1>ToDo List - Date: <span id='today'>&nbsp;</span></h1>

  <div id="todolist">
  <p>
    <input type="button" id="additem" value="Add Item">
  </p>
  </div>

  <hr>

  <div>
<p>
    <input type="button" id="sortitems" value="Sort and Display Items">
</p>

<p id="displayitems">
</p>
  </div>
 </body>
4

1 に答える 1