1.需求

正好做到设置和获取表单数据的功能,做个整理

2.计划安排

3.计划实施

1.获取值

<!--1获取普通文本框的值-->
<input type="text" id="a1"/> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#submit').click(function () {
console.log($('#a1').val());
})
</script>
<!--2.获取checkbox是否打勾-->
<input type="checkbox" id="a1"/> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#submit').click(function () {
//打勾返回true,没有打勾返回false
console.log($('#a1').is(":checked"));
})
</script>
<!--3.获取radio选中的value值-->
<input type="radio" name="age" value="1"/>
<input type="radio" name="age" value="2"/>
<input type="radio" name="age" value="3"/> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#submit').click(function () {
console.log($('input[name="age"]:checked').val());
})
</script>
<!--4.获取选中的下拉框的值-->
<select name="" id="select">
<option value="1">111</option>
<option value="2">222</option>
<option value="3">333</option>
<option value="4">444</option>
</select> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#submit').click(function () {
console.log($('#select').val());
       $("#childmodel").find("option:selected").text();
}) </script>

2.设置值

<!--1设置普通文本框的值-->
<input type="text" id="a1"/> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#a1').val(1111)
</script>
<!--2.设置checkbox打勾-->
<input type="checkbox" id="a1"/> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#a1').attr('checked','checked');
</script>
<!--3.设置radio选中-->
<input type="radio" name="age" value="1"/>
<input type="radio" name="age" id="a2" value="2"/>
<input type="radio" name="age" value="3"/> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
$('#a2').attr('checked','checked');
</script>
<!--4.设置选中的下拉框的值-->
<select name="" id="select">
<option value="1">111</option>
<option value="2">222</option>
<option value="3">333</option>
<option value="4">444</option>
</select> <!--btn-->
<button id="submit">按钮</button>
<script src="jquery-1.8.3.min.js"></script>
<script>
//设置value=4的值为选中
$('#select').val('4');
//文本
var prov = document.getElementById(id);
for (var i = 0, len = prov.options.length; i < len; i++)
if (prov.options[i].text==text)
prov.selectedIndex = i;
</script>

4.总结

一些小东西总是容易忘,记录下来方便查找

jquery获取和设置表单数据的更多相关文章

  1. jQuery 获取和设置表单元素

    jQuery提供了val()方法,使用它我们可以快速地获取和设置表单的文本框.单选按钮.以及单选按钮的值. 使用val()不带参数,表示获取元素的值 使用val()给定参数,则表示把值赋给元素 如下: ...

  2. jQuery 获取、设置表单元素的值

    获取表单元素值: 文本框,文本区域: $("#txt").attr("value"): 多选框 checkbox:$("#checkbox_id&qu ...

  3. jquery ajax异步提交表单数据

    使用jquery的ajax方法可以异步提交表单,成功后后台返回json数据,回调函数处理,可以不用刷新页面,达到异步的目的: 处理表单的数据可以用serialize()方法进行序列化,而如果提交的数据 ...

  4. Django框架获取各种form表单数据

    Django中获取text,password 名字:<input type="text" name="name"><br><br& ...

  5. Jquery如何序列化form表单数据为JSON对象 C# ADO.NET中设置Like模糊查询的参数 从客户端出现小于等于公式符号引发检测到有潜在危险的Request.Form 值 jquery调用iframe里面的方法 Js根据Ip地址自动判断是哪个城市 【我们一起写框架】MVVM的WPF框架(三)—数据控件 设计模式之简单工厂模式(C#语言描述)

    jquery提供的serialize方法能够实现. $("#searchForm").serialize();但是,观察输出的信息,发现serialize()方法做的是将表单中的数 ...

  6. Jquery如何序列化form表单数据为JSON对象

    jquery提供的serialize方法能够实现. $("#searchForm").serialize();但是,观察输出的信息,发现serialize()方法做的是将表单中的数 ...

  7. 通过jquery的serializearray处理表单数据成json格式,并提交到后台处理

    var params = $("#myform").serializeArray(); var values = {}; for (var item in params) { va ...

  8. Flutter Form正确使用方法【可正确获取提交的表单数据】

    import 'package:flutter/material.dart'; void main() => runApp(new HomePage()); class HomePage ext ...

  9. jquery实现ajax提交表单数据或json数据

随机推荐

  1. BZOJ3159: 决战

    方法很简单,树剖,把区间提取出来,打翻转标记,再放回去. 注意:由于某种原因,我写的是把题目中的r忽略掉的一般情况,否则简单得多. 本来以为写起来也很简单T_T #include<bits/st ...

  2. js021-Ajax与Comet

    js021-Ajax与Comet 本章内容: 使用XMLHttpRequet对象 使用XMLHttpRequet事件 跨域Ajax通信的限制 Ajax技术的核心是XMLHttpRequet对象 21. ...

  3. 转:遗传算法解决TSP问题

    1.编码 这篇文章中遗传算法对TSP问题的解空间编码是十进制编码.如果有十个城市,编码可以如下: 0 1 2 3 4 5 6 7 8 9 这条编码代表着一条路径,先经过0,再经过1,依次下去. 2.选 ...

  4. Jint .net平台的javascript引擎

    使用需求 有时候一段Javascript代码写的很棒,而我们又无法将之翻译成.net或翻译之成本很高的时候 我们就可以使用Jint引擎来运行Javascript代码,来得到我们想要的结果 或者上 ht ...

  5. geoip scala api

    #!/bin/bash /home/hadoop/spark-1.6.2/bin/spark-shell --master spark://hbase11:7077 --executor-memory ...

  6. StringBuilder 拼接sql语句比较快

    StringBuilder 拼接sql语句比较快StringBuilder strBuilder = new StringBuilder();strSql += "insert into t ...

  7. springmvc 表单字段list提交问题

    比如用户表user 选课表course 用户表有选课字段list<course> courses=new ArrayList<course>(); <input type ...

  8. CSS实时编辑显示

    方法 CSS实时编辑显示:通过display:block让css文本显示出来,再加上contentEditable使文本可编辑 <!DOCTYPE html> <html> & ...

  9. FBX Software Development Kit

    FBX Software Development Kit The FBX Software Development Kit (FBX SDK) allows software developers t ...

  10. Index/Common目录下文件

    1.在Common目录下创建Common.php(系统会自动加载Common.php) 代码: function say(){ echo '; } 在IndecAction.php输出 public ...