HTML给表单元素赋值,JQuery表单元素取值赋值方法总结

一、普通文本框的赋值与取值

1.1.1赋值

jQuery 表单元素取值与赋值方法总结

function get(){

var test1 = $("input.test1").val();

$(".test2").val(test1);

}

运行效果：

1.1.2 取值

示例代码：

jQuery 表单元素取值与赋值方法总结

function get(){

var test1 = $("input.test1").val();

$("#span").html(test1);

}

运行效果：

二、获取和设置单选项radio的值

2.1.1获取单选项radio的值

1

2

function Show_redio()

{

//var _val = $('input:radio:checked').val();

var _val = $("input[type='radio']:checked").val();

//var _val = $("input[name='rd']").val();

alert(_val);

}

运行效果：

三、获取和设置复选框的值

A

B

C

function Show_checkbox() {

//取得多选框值

//多选框checkbox：$("#checkbox_id").attr("value");

val3 = $("#checkbox_id3").attr("value");

val2 = $("#checkbox_id2").attr("value");

val1 = $("#checkbox_id1").attr("value");

//多选框checkbox： $("#chk1").attr("checked",'');//不打勾

//$("#chk2").attr("checked",true);//打勾

//if($("#chk1").attr('checked')==undefined) //判断是否已经打勾

//多选框checkbox 不打勾

$("#checkbox_id3").attr("checked", '');

//多选择框checkbox打勾

$("#checkbox_id1").attr("checked", false);

$("#checkbox_id2").attr("checked", true);

if($("#checkbox_id1").attr('checked') == undefined)

alert("没有选中!");

else

alert("已经选中!");

}

运行效果：

四、获取和设置下拉菜单列表的值

A

B

C

D

function Show_select() {

var options = $("#_select option:selected"); //获取选中的项

alert(options.val()); //拿到选中项的值

$("#span").html(options.text());

}

运行效果：

//设置select下拉框的第二个元素为当前选中值 $("#_select")[0].selectedIndex = 2;

运行效果：

//下拉框select

//设置一下值为D的项目为当前选中项

$("#_select").attr("value",'D');

//添加下拉框的option

$("EF").appendTo("#_select");

//清空下拉框

$("#_select").empty();

五、获取和设置文本框/文本域的值

function Show_textarea() {

//填充内容

var test = "werrtyhgfdsaadfgh"

$("#text").val(test);

//清空内容

//$("#text").attr("value","");

}

运行效果：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。