JavaScript经典案例：用户协议确认

效果展示：

CSS代码：

<style type="text/css">
	#wrapper {
		width: 80%;
		height: 500px;
		margin: 50px auto;
		background: white;
	}

	#wrapper #title {
		width: 60%;
		height: 30px;
		margin: 0 auto;
		line-height: 30px;
		text-align: center;
		background: linen;
	}

	#wrapper #paragraph {
		width: 60%;
		height: 400px;
		margin: 0 auto;
		overflow: auto;
		background-color: antiquewhite;
	}

	#wrapper #agreement {
		margin: 20px auto;
		text-align: center;
	}
</style>
           

HTML代码：

<div id="wrapper">
	<div id="title">《洛克王国》软件之《用户守则》</div>
	<p id="paragraph">
		尊敬的用户：<br />
		　　根据《洛克王国》儿童社区网络社区《用户协议》（简称“《洛克王国》用户协议”）
		第9.5条等相关条款的约定，您及其他用户均不得进行任何有损于腾讯或其他用户合法权益的行为。为了落实这一约定，腾讯特依据《洛克王国》许可协议第9.5条、第10.1条、第10.2条和第13.3条之约定，制定本《软件之<用户守则>》（以下简称“《用户守则》”），作为《洛克王国》许可协议的补充协议，请您及其他用户遵守：<br />
			　　1、您使用的QQ帐号在《洛克王国》软件中如果下列行为之一的，则属于《洛克王国》许可协议第9.5条约定的腾讯所禁止的行为，腾讯将对该QQ帐号采取《洛克王国》许可协议第10.2条所约定的第（15）项处理措施，即永久性地、不可撤销地禁止您及其他用户凭借该QQ帐号登录《洛克王国》，并删除、清空该QQ帐号在《洛克王国》当中产生的所有软件使用后台数据、洛克贝、虚拟道具等资料，但您仍可以凭借该QQ帐号正常消费腾讯提供的其他的互联网服务：<br />
			　　 (1) 散布有损祖国尊严和荣誉、国家安全、危害社会秩序的言论；<br />
			　　 (2) 利用各种方式攻击或入侵《洛克王国》的服务器； <br />
			　　 (3) 在《洛克王国》中以任何方式复制道具物品（包括其中的洛克贝和道具等）。<br />
			　　2、您使用的QQ帐号在《洛克王国》中如有传播、散布任何外挂程序（包括但不限于加速器、修改工具等）以及游戏
			BUG，发布非法链接、代练信息的，腾讯将对该QQ帐号采取《洛克王国》许可协议第10.2条所约定的第（3）项处理措施，即当前使用的游戏帐号项目下的《洛克王国》游戏角色，使之在封停期限内不能使用<br />
			　　3、您使用的QQ帐号在《洛克王国》中如有使用任何外挂程序（包括加速器、修改工具等）和/或
			BUG，并被《洛克王国》之安全程序监测到的，腾讯将采取《洛克王国》许可协议第10.2条所约定的第（2）项处理措施，即暂时禁止您凭借该QQ帐号登录《洛克王国》，禁止登录期限各有不同：<br />
			　　 (1) 第一次监测到的，视情节严重性，禁止登录期限为3-7天；<br />
			　　 (2) 第二次监测到的，封停帐号/角色永久；<br />
			　　4、您使用的QQ帐号在《洛克王国》中如拥有异常的虚拟物品的，腾讯将对该虚拟物品采取《洛克王国》许可协议第10.2条所约定的第（9）项处理措施，即永久性地、不可撤销地将该QQ帐号非法获取的Q币、Q点、洛克贝、虚拟道具和/或虚拟装扮等虚拟物品全部删除，或者将其返还给原来的通过合法途径取得其使用权的其他用户。<br />
			　　5、您使用的QQ帐号在《洛克王国》中如利用了该软件当中的BUG或者能够用于获取非法利益的漏洞，腾讯将对该QQ帐号采取《洛克王国》许可协议第10.2条所约定的第（2）项处理措施，即暂时禁止您凭借该QQ帐号登录《洛克王国》。再次有类似行为的，腾讯将采取《洛克王国》许可协议第10.2条所约定的第（15）项处理措施。<br />
	</p>
	<div id="agreement">
		<input type="checkbox" id="checkbox" value="" disabled="disabled" checked="checked" />我已仔细阅读并同意以上用户协议！
		<input type="submit" id="submit" value="确&nbsp;&nbsp;&nbsp;&nbsp;定" disabled="disabled" />
	</div>
</div>
           

JavaScript代码：

<script type="text/javascript">
	window.onload = function() {
		var inputs = document.getElementsByTagName("input");
		var paragraph = document.getElementById("paragraph");
		paragraph.onscroll = function() {
			if (paragraph.scrollHeight - paragraph.scrollTop == paragraph.clientHeight) {
				inputs[0].disabled = false;
				inputs[1].disabled = false;
			} else {
				inputs[0].disabled = true;
				inputs[1].disabled = true;
			}
		}
	}
</script>