使用javascript对项目列表进行排序

时间:2010-06-09 03:48:23

标签: javascript sorting

我正在进行一项课程作业,我需要完成以下任务:

1用户在文本框中键入项目列表(表单域) 2当用户按下排序按钮时,文本框中的列表将被排序 3它从文本框中获取文本并将排序后的文本放回文本框

请帮忙!

编辑:这是我到目前为止所做的,但它不起作用。谢谢你们。

<script type="text/javascript">
    function addName()
    {
    var name2add = document.nameForm.newName.value;
    // is the name 1-15 characters in length?
    if (name2add.length > 15 || name2add.length == 0)
    {
        // no, warn the user
        alert("Name must be between 1 and 15 characters long.");
        // put the focus and selection back in the name text box
        document.nameForm.newName.focus();
        document.nameForm.newName.select();
    } else {
        theSelect = document.nameForm.nameList;
        newVal = theSelect.options.length;
        //alert(name2add + " will be #" + newVal);
        // crate the new Option object to insert into the list
        var newOption = new Option(name2add,newVal);
        // insert the new option into the list
        theSelect.options[newVal] = newOption;
        // clear out the name text field and return the focus there
        document.nameForm.newName.value = "";
        document.nameForm.newName.focus();
    }
    return;
    }
    function deleteName()
    {
        var theSelect = document.nameForm.nameList;
        theSelect.options[theSelect.selectedIndex] = null;
        return;
    }
    </script>

    </head>

    <body>
    <form id="form4" name="nameForm" method="post" action="">
      <p>
        <label>
          <input type="text" name="newName" id="newName" />
        </label>
      </p>
      <p>
          <input type="button" value="Add Name To List" name="addButton" id="addButton" onclick="addName()" />

      </p>
      <p>
        <label>
          <select name="list" size="3" id="nameList" >
          </select>
        </label>
      </p>
    <p>
    <INPUT TYPE="BUTTON" NAME="sort" VALUE="  Sort  " 
    OnClick="sortOptions(document.nameForm.list)">
    </p>
    <p>
    <input type="button" value="Remove Name From List" name="deleteButton" id="deleteButton" onclick="deleteName()" />
    </p>
    </form>

1 个答案:

答案 0 :(得分:0)

幸运的是,Javascript提供了原生排序算法,因此您不必自己编写。它是array.sort()。

所以,基本上,从文本框中获取文本,将文本放入数组中。然后,在数组上运行.sort();然后把它放回文本框。

至于将文本放入数组中,您可以使用string.split(“\ n”),如果它用行分隔,或者使用string.split(“,”),如果它用逗号分隔。

var itemsToSort = document.getElementById("text_box")
var arrayToSort = itemsToSort.split("\n")
arrayToSort.sort()
document.getElementById("text_box").value = arrayToSort.join("\n")

用于ID为“text_box”的文本框。