<body>
<body><!—使用者界面,一個DIV層和兩個按鈕-->
<div id="divNames" style="width: 422px; height: 100px; border-right: blue 1px solid; border-top: blue 1px solid; border-left: blue 1px solid; border-bottom: blue 1px solid;">
</div>
<input id="Button1" type="button" value="升序" οnclick="return Button_onclick(this.id)" />
<input id="Button2" type="button" value="降序" οnclick="return Button_onclick(this.id)"/>
<mce:script language="javascript" type="text/javascript"><!--
// <!CDATA[
function Student( name, number ) // 學生對象構造函數
{
this.name = name; // 學生名字屬性
this.number = number; // 學生名字屬性
}
var students = new Array( new Student("John",4), new Student("Wendy",2), new Student("Vicky",5),
new Student("Kevin",1), new Student("Richard",3) ); // 5個學生
var g_orderRule; // 規則開關
var names = ""; // 名字序列
for( x in students ) // 組合排序前的學生名字
{
names += students[x].name + " ";
}
tn = document.createTextNode( names ); // 建立文節點,用于顯示結果
var div = document.getElementById("divNames"); // 擷取DIV層
div.appendChild(tn) // 将文本節點添加為層的子節點
tn.nodeValue = names; // 設定文本節點的文字屬性
function Order( obj, funcRule) // 排序函數
{
if( (typeof(funcRule)!="function") || ( funcRule.length<2) ) // 檢查參數的正确性
{
var e = new Error(); // 不正确則抛出異常
e.message = "參數不符合要求";
throw e;
}
for( n in obj ) // 周遊資料組,按回調函數的規則排序
{
for( m in obj )
{
// funcRule為外部回調函數,使用者可在回調函數中實作自已的排序規則
if( funcRule( obj[n].number, obj[m].number ) )
{
var tmp = obj[n];
obj[n] = obj[m];
obj[m] = tmp;
}
}
}
names = "";
for( x in obj )
{
names += obj[x].name + " "; // 組合排序後的名字
}
tn.nodeValue = names;
}
function funcRule( arg1, arg2 ) // 排序規則回調函數
{
if( (typeof(arg1) != "number")||(typeof(arg2) != "number") ) // 參數檢查
{
var e1 = new Error();
e1.message = "學生的序号屬性為非數字";
throw e1;
}
if( g_orderRule ) // 根據使用者的選擇設定排升規則
{
return arg1<arg2; // 升序
}
else
{
return arg1>arg2; // 降序
}
}
function Button_onclick( objID ) // 按鈕單擊事件處理程式
{
if( objID=="Button1" )
{
g_orderRule = true;
}
else
{
g_orderRule = false;
}
try
{
Order( students, funcRule ); // 排序并輸出
}
catch( e )
{
alert(e.message);
}
}
// --></mce:script>
</body>
</html>