使用jquery获取form表单的值

标签: jquery
3人阅读 评论(0) 收藏 举报
分类:
<!DOCTYPE html>
<html>  // 主要利用了jquery的
<head>
<meta charset="UTF-8">
<title>jquery练习</title>
<meta charset="UTF-8">
<title>jq:</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
<script>
$(document).ready(function() {
$("#test-form button").click(function() {
// 获取name
var firstInput = $("#test-form input").first();
var name = firstInput.val();
console.log(name);
// 获取email
var secondInput = $("#test-form input[name=email]").val();
console.log(secondInput);
// 获取password
var password = $("#test-form input[name=password]").val();
console.log(password);
// 获取gender
var password = $("#test-form input[name=gender]:checked").val();
console.log(password);
// 获取city--获取下拉列表选中的值
var selectBiao = $("#test-form select option:checked").val();
console.log(selectBiao);
})
})
</script>
</head>


<body>
<form id="test-form" action="#0" onsubmit="return false;">
<p><label>Name: <input name="name"></label></p>
<p><label>Email: <input name="email"></label></p>
<p><label>Password: <input name="password" type="password"></label></p>
<p>Gender: 
<label><input name="gender" type="radio" value="m" checked> Male</label>
<label><input name="gender" type="radio" value="f"> Female</label></p>
<p><label>City: <select name="city">
        <option value="BJ" selected>Beijing</option>
        <option value="SH">Shanghai</option>
        <option value="CD">Chengdu</option>
        <option value="XM">Xiamen</option>
    </select></label></p>


<p><button type="submit">Submit</button></p>
</form>
</body>


</html>
查看评论

jQuery高级篇 第二章 Ajax在jQuery中的使用视频课程

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。
  • 2017年04月01日 14:14

JQuery获取form表单值

jquery如何取得text,areatext,radio,checkbox,select的值,以及其他一些操作;假如我们有如下页面: ...........省略 下面来看怎么取得FORM中的各种值...
  • qq353067548
  • qq353067548
  • 2014-04-18 12:00:21
  • 991

jquery批量获取form表单要提交的值

jquery代码:alert($("form").serialize());完整请求: 这个方法适用于get请求,对于post请求我没试过。 $("#generate").click(funct...
  • zhezhebie
  • zhezhebie
  • 2017-08-15 10:25:05
  • 2608

jquery-读取form表单中的所有数据列表

$(function() { $('#submit').click(function() { var d = {}; var t = $('form').serializeArra...
  • qiaziliping
  • qiaziliping
  • 2017-10-12 17:37:03
  • 180

jQuery 获取表单元素中值的方法

jQuery获取表单的值,根据表单中的内容和表单分类获取 1、根据属性选择input框值 jQuery("input[title='jing']").val(); 表单中一般为input框,可以根据以...
  • u010865136
  • u010865136
  • 2015-10-10 15:00:37
  • 1956

jquery 无法获取表单数据的问题

今天在做一个form,使用 $('#id').serialize() 死活无法获取到表单; 经过排查测试,发现form里面的input都设置了id,把id改成name即可以获取到表单数据...
  • langyan122
  • langyan122
  • 2017-07-14 09:59:33
  • 307

jQuery 获取checkbox选中的值form表单提交例子

前台页面 pageEncoding="utf-8"%> 无标题页 var zhi  function addClick(){  $(document).r...
  • JavaLLU
  • JavaLLU
  • 2018-01-12 16:39:18
  • 285

用jQuery获取form表单值的方法总结

获取表单元素 单选框(radio):              $(":radio[name=sex]:checked").val(); 多选框(checkbox):              var...
  • dreamsunday
  • dreamsunday
  • 2014-03-28 17:27:26
  • 7450

jquery如何循环获取表单值

姓名: 电话: 确定 姓名: 电话: 确定 姓名: 电话: 确定 ...
  • qq_27681741
  • qq_27681741
  • 2016-11-11 16:44:53
  • 1092

servlet将excle数据导入到数据库中

  • 2013年03月21日 17:25
  • 8KB
  • 下载
    个人资料
    持之以恒
    等级:
    访问量: 1万+
    积分: 519
    排名: 9万+