js入门例子小结4

来源:互联网 发布:多个数最小公倍数算法 编辑:程序博客网 时间:2024/05/19 16:35

感谢张龙老师

js23.html

<script type="text/javascript">//遍历所有的链接function cl(){alert(document.links.length);for(var i = 0 ; i < document.links.length; i++){alert(document.links[i]);}}</script>  </head>    <body><h1>搜索引擎列表:</h1><a href = "http://www.google.com">google</a><br><a href = "http://www.baidu.com">baidu</a><br><a href = "http://www.sougu.com">sougu</a><br><a href = "http://www.bing.com">bing</a><br><input type = "button" value = "look"  onclick = "cl()">     </body>

js24.html


<script type="text/javascript">//自动对准每个输入框的开始部分function moveNext(object,index){if(object.value.length == 4){document.forms[0].elements[index + 1].focus();}}function  showResult(){var f = document.forms[0];var result = "";for(var i = 0; i < 4 ; i++){result += f.elements[i].value;}alert(result);}</script>  </head>    <body onload = "document.forms[0].elements[0].focus();" ><form ><input type ="text" size = "3" maxlength = "4" onkeyup="moveNext(this,0)"/>-<input type ="text" size = "3" maxlength = "4"onkeyup="moveNext(this,1)"/>-<input type ="text" size = "3" maxlength = "4"onkeyup="moveNext(this,2)"/>-<input type ="text" size = "3" maxlength = "4"onkeyup="moveNext(this,3)"/><input type = "button"  value = "显示" onclick = "showResult();"></form></body>


js25.html


<script type="text/javascript">//生成cookievar today = new Date();var expireDay = new Date(); var msPerMonth = 31 * 24 * 60 * 60 * 1000;expireDay.setTime(today.getTime() + msPerMonth); document.cookie = "name=zhang;expie=" + expireDay.toGMTString();document.writeln("cookie已经写到硬盘上了");document.writeln("内容是" + document.cookie);document.writeln("有效日期是:");document.writeln(expireDay.toGMTString());</script>


begain,jsp 和end.jsp实现动态生成多选框,并对多选框进行全选、展开或收缩的操作。

1.begain.jsp中写表单

<body><form action="end.jsp" method ="post" onsubmit = "return validate();">请输入数字(5--15)<input type = "text" name = "number"><input type ="submit" ></form> </body>

2.处理单击事件,实现客户端验证


<script type="text/javascript">//确认输入的是10到15之间的数字。不是,重新输入。function validate(){var num = document.getElementsByName("number")[0];if(num.value.length == 0){alert("请重新输入");num.focus();return false;}for(var i = 0; i < num.value.length; i++){var param = "0123456789";if(param.indexOf(num.value.charAt(i)) == -1){alert("请输入数字");num.focus();return false;}}if(parseInt(num.value) < 10 || parseInt(num.value) > 15){num.value  = 10;}return true;}</script>


3.处理action方法,转向end.jsp


<script type="text/javascript">//实现全选function checkAll(){var checkAll = document.getElementsByName("checkAll")[0];var check = document.getElementsByName("check");if(checkAll.checked ){for(var i = 0; i < check.length; i ++){check[i].checked = true;}}else {for(var i = 0; i < check.length; i ++){check[i].checked = false;}}}//实现展开和收缩function handle(){with(document){var button = getElementById("change");var table = getElementById("table");}if(button.value == "收缩"){table.style.display = "none";button.value = "展开";}else if(button.value == "展开"){table.style.display = "block";button.value = "收缩";}}</script>



0 0
原创粉丝点击