jQuery 控制表单元素
使用 jQuery 控制表单元素可以取值及设置 radio, checkbox, select 操作,简单的透过 jQuery :checked 取得 Html <form> 表单元素 achieved 资料,获取 Radio 单选框的选取值与 Checkbox 多选框的选取值方法及设定值的方法,并使用 jQuery 提供的方法对其进行操作。启用/停用表单元素元素 disabled 也可以动态控制输入元素的安排。
取得 RADIO 单选框选中的值,单选框只有一个值由 .each 找到 :checked 的元素。
var result = "";
$("input[type=radio]:checked").each(function () {
result = $(this).val() ;
});
选取 RADIO 单选框的第二个元素(第一个元素为 [0])。
$("input[type=radio]")[1].checked = true;
取消选取 RADIO 单选框的元素,在此选取属性 true 不适合可能会选取最后一个。
$("input[type=radio]").attr("checked",false);
取得 CHECKBOX 复选框选中的值,复选框可能多个值由 .each 找到 :checked 的元素并加入阵列中。
var c=[];
$("input[type=checkbox]:checked").each(function () {
c.push($(this).val());
});
result = c.toString();
取得 SELECT 下拉清单选中的文字,由 .each 找到 :selected 的 <option> 元素。
$("div.dynamically select option:selected").each(function () {
result = $(this).text();
});
取得 SELECT 下拉清单选中的值,由 .each 找到 :selected 的 <option> 元素的值。
$("div.dynamically select option:selected").each(function () {
result = $(this).val();
});
控制表单元素 <select> 值的设置
必威体育手机客户端中表单 <select> 元素用来建立下拉式选单的 HTML 元素。透过 <select> 元素可以建立包含多个选项的下拉式选单,并且使用者可以选择其中的一个选项。选项元素使用 <option> 元素来建立选单中的选项,可以使用 value 属性来指定每个选项的值,并使用 selected 属性来指定预设选择的选项、multiple 属性设置为 true 则允许使用者选择多个选项。
添加一个 <option> 项目,添加于最后。
$("select").append("<option value='NEW'>Added</option>");
在前面插入一个 <option> 项目,添加于最前面。
$("select").prepend("<option value='NULL'>PLEASE SELECT</option>");
删除第一个(索引值最小的) <option> 项目。
$("select option:first").remove();
$("select option:first-child").remove(); /* 影响全部符合的 select 元素 */
删除最后一个(索引值最大的) <option> 项目。
$("select option:last").remove();
$("select option:last-child").remove(); /* 影响全部符合的 select 元素 */
删除值为 Option by 2 的 <option> 项目。
$("select option[value='Option by 2']").remove();
清空 <select> 中全部的 <option> 项目。
$("select").empty();
jQuery Selectors Form 表单项目的选择
HTML 表单项目 Radio、Checkbox、Select 网页上的应用,可以针对表单元素的验证、检查 EMAIL 邮箱地址格式是否正确、检查 Password Strength 密码强度是否足够,JavaScript、Ajax、jQuery 之间的关系、取得表单中的元素值的方法。可以简化网页开发中对 DOM 操作、事件处理、元素动画效果等方面的编程。使用 jQuery 可以轻松完成表单的提交和处理,例如透过 Ajax 非同步的 JavaScript 与 XML 技术将表单数据提交到后台服务器进行处理,进一步提高开发效率和网页浏览者合理化体验。