实例
<!doctype html>
<html>
<head>
<title>表单节点的获取</title>
<meta charset='utf-8'/>
<style type="text/css">
table,td{border-collapse:collapse;}
td{padding:10px;}
div{margin-top:40px;}
</style>
<script src='jquery-3.3.1.min.js'></script>
</head>
<body>
<center>
<div>
<form action="" method ='post' enctype="multipart/form-data" >
<table border='1'>
<tr>
<td>用户名:</td>
<td>
<input type='text' name='username'/>
</td>
</tr>
<tr>
<td>密码:</td>
<td>
<input type='password' name='password'/>
</td>
</tr>
<tr>
<td>确认密码:</td>
<td>
<input type='password' name='repassword' />
</td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type='radio' name='sex' value='男' checked="checked"/>男
<input type='radio' name='sex' value='女' />女
</td>
</tr>
<tr>
<td>兴趣爱好:</td>
<td>
<input type='checkbox' name='hobby[]' value='篮球' checked="checked"/>篮球
<input type='checkbox' name='hobby[]' value='足球' checked="checked"/>足球
<input type='checkbox' name='hobby[]' value='排球' />排球
<input type='checkbox' name='hobby[]' value='乒乓球' />乒乓球
</td>
</tr>
<tr>
<td>城市:</td>
<td>
<select name='city'>
<option value='北京'>北京</option>
<option value='天津' selected="selected">天津</option>
<option value='上海'>上海</option>
<option value='重庆'>重庆</option>
</select>
</td>
</tr>
<tr>
<td>个人介绍:</td>
<td>
<textarea name='intro' style='resize:none'>hello world</textarea>
</td>
</tr>
<tr>
<td>头像:</td>
<td>
<input type='file' name='profile' />
</td>
</tr>
<tr>
<td colspan='2' style='text-align:center'>
<input type='submit' value="提交" />
<input type='reset' value="重置"/>
<button>点击</button>
</td>
</tr>
</table>
</form>
</div>
</center>
</body>
<script type="text/javascript">
//获取焦点事件
$('input[name=username]').focus(function(){
$(this).css('border','solid 2px blue');
})
//失去焦点事件
$('input[name=username]').blur(function(){
//获取用户输入的值
var tv = $(this).val();
console.log(tv);
})
</script>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
