欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

JQuery成绩添加和排序

程序员文章站 2024-03-21 19:29:16
...

JQuery成绩添加和排序

<html>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
	<body>
		<div>
			<label>学号：</label>
			<input id="id"/>
			
			<label>分数：</label>
			<input id="score"/>
			<button onclick="add()">添加</button>
			<button onclick="sort(1)">升序</button>
			<button onclick="sort(0)">降序</button>
		</div>
		
        <div>
            <table id="table">
            </table>
        </div>
	</body>
</html>
<script>
	var data = [];
	var table = $("#table");
	
	function add(){
		var id = $("#id").val().trim();
		var score = $("#score").val().trim();
		if(!id) alert("学号不能为空");
		if(!score) alert("分数不能为空");
		var item = {id:id,score:score};
		if(data.length == 0){
			table.append('<tr><td>学号</td><td>分数</td></tr>');
		}
		data.push(item);
		table.append('<tr><td>'+id+'</td><td>'+score+'</td></tr>');
	}
	
	function sort(flag){
		data.sort(function(a,b){
			if(flag == 1){
				return a.score - b.score;
			}else{
				return b.score - a.score;
			}
		});
		table.empty();
		table.append('<tr><td>学号</td><td>分数</td></tr>');
		for(var i=0; i<data.length; i++){
			table.append('<tr><td>'+data[i].id+'</td><td>'+data[i].score+'</td></tr>');
		}
	}
</script>
相关标签： javascript jquery

上一篇： 科大讯飞语音识别-测试18/04/04 博客分类： 常用开源 语音识别 

下一篇： Hibernate Jar/Doc下载地址 博客分类： db hibernatejardocdownload 

推荐阅读