【原创】冒泡法排序演示 (适合教学使用)

raid0 2006-07-09 07:37:15

<html>
<head>
<script language="javascript">
var first,second,random,num,finish
finish=0;
random=1;
first=500;
second=500;
//----------------------initialize array-------------------
function Initialize(count,isRandom) {
i=0;
flag=0;
iArray=new Array();
for(var k=0;k<count;k++)
{
if(isRandom==1)
{
iArray[k]=Math.round(Math.random()*10);
}
else
{
iArray[k]=count-k;
}
}
n=iArray.length-1;
t=n;
}
//---------------------------------------------------------

//------------------show array-----------------------------
function ShowItem() {
Gitem="";
for(var j=0;j<iArray.length;j++)
{
if(j==i||j==i+1)
{
if(i<n)
{
Gitem=Gitem + "<font color=\"ff0000\">" + iArray[j] + "<\/font>" + "<br>";
}
else
{
Gitem=Gitem + "<font color=\"0000ff\">" + iArray[j] + "<\/font>" + "<br>";
}
}
else if(j>n)
{
Gitem=Gitem + "<font color=\"0000ff\">" + iArray[j] + "<\/font>" + "<br>";
}
else
{
Gitem=Gitem + iArray[j] + "<br>";
}
}
Gitem=Gitem + "<br>第" + (t-n+1) + "轮比较";
maopao.innerHTML=Gitem;
}
//---------------------------------------------------------

//-----------------First Show------------------------------
function FirstShow() {
ShowItem();
setTimeout("SecondShow()",first);
}
//---------------------------------------------------------

//-----------------Second Show-----------------------------
function SecondShow() {
if(i<n)
{
if(iArray[i]>iArray[i+1])
{
var temp=iArray[i];
iArray[i]=iArray[i+1];
iArray[i+1]=temp;
flag++;
ShowItem();
}
i++;
}
else
{
n--;
if(n<1||flag==0)
{
maopao.innerHTML=Gitem + " 排序完毕";
finish=1;
return;
}
else
{
i=0;
flag=0;
}
}
setTimeout("FirstShow()",second);
}
//----------------------------------------------------------
</script>
<head>
<body onload="Initialize(10,1);FirstShow();">
<center><b>冒泡法排序演示 http://www.raid1.cn</b></center>
<br>
<div id="maopao" align="center">
</div>
<br>
<form name="form1">
<table align=center>
<tr>
<td>
<table width="200">
<tr>
<td>
<FIELDSET>
<LEGEND>速度</LEGEND>
<input name="speed" type="radio" value="慢速" onclick="first=1000;second=1000">慢速
<input name="speed" type="radio" value="中速" onclick="first=500;second=500" checked>中速
<input name="speed" type="radio" value="快速" onclick="first=50;second=50">快速
</FIELDSET>
</td>
</tr>
</table>
</td>
<td>
<FIELDSET>
<LEGEND>排序数字选择</LEGEND>
<input name="isRandom" type="radio" value="随即数" onclick="random=1;" checked>随机数
<input name="isRandom" type="radio" value="倒序数" onclick="random=2;">倒序数
</FIELDSET>
</td>
<td>
<FIELDSET>
<LEGEND>排序数字个数</LEGEND>
个数:<input type="text" name="num" value="10">
</FIELDSET>
</td>
</tr>
</table>
<table align=center>
<tr>
<td>
<input type="submit" value="排序" onclick="if(finish!=1){alert('正在排序中......');return false;}finish=0;Initialize((isNaN(document.form1.num.value)||(document.form1.num.value==''))?10:document.form1.num.value,random);FirstShow();return false;">
</td>
</tr>
</table>
</form>
</body>
</html>

...全文