jQuery---分类添加内容

来源：互联网发布：莱恩打碟软件下载编辑：程序博客网时间：2024/06/05 05:50
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script type="text/javascript" src="jquery-1.7.2.js"></script><script type="text/javascript">//需求: 点击 submit 按钮时,　检查是否选择 type, 若没有选择给出提示: "请选择类型"; //     检查文本框中是否有输入(可以去除前后空格), 若没有输入,则给出提示: "请输入内容";//若检查都通过, 则在相应的 ul 节点中添加对应的 li 节点 //需求2: 使包括新增的 li 都能响应 onclick 事件: 弹出 li 的文本值. $(function(){function show(li){alert($(li).text());}$("li").click(function(){show(this);});$("#submit").click(function(){var $type=$(":radio[name='type']:checked");if($type.length==0){alert("请选择您的类型");return false;}var $name=$(":text[name='name']");var name=$name.val();name=$.trim(name);$name.val(name);if(name==""){alert("请输入内容");return false;}$("<li>"+name+"</li>").appendTo($("#"+$type.val())).click(function(){show(this);}); return false;});})</script></head><body><p>你喜欢哪个城市?</p><ul id="city"><li id="bj">北京</li><li>上海</li><li>东京</li><li>首尔</li></ul><br><br><p>你喜欢哪款单机游戏?</p><ul id="game"><li id="rl">红警</li><li>实况</li><li>极品飞车</li><li>魔兽</li></ul><br><br><form action="dom-7.html" name="myform"><input type="radio" name="type" value="city">城市<input type="radio" name="type" value="game">游戏name: <input type="text" name="name"/><input type="submit" value="Submit" id="submit"/></form></body></html>
0 0