DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> javascript jquery對form元素的常見操作詳解
javascript jquery對form元素的常見操作詳解
編輯:關於JavaScript     

1.下拉框 select :

移除option

$("#ID option").each(function(){
   if($(this).val() == 111){
   $(this).remove();
 }
});

添加option

$("<option value='111'>UPS Ground</option>").appendTo($("#ID"));

取得下拉選單的選取值

//取下拉選中的文本
$('#testSelect option:selected').text();
$("#testSelect").find('option:selected').text();
document.all.objSelect.options[document.all.objSelect.selectedIndex].text; //js操作 objSelect為select的name//取得下拉選中值
$("#testSelect").val();
//js操作
document.getElementById('objSelect').value=2;
document.all.objSelect.value;

根據option的值選中下拉框

$('#testSelect').val('111');document.all.objSelect.value = objItemValue; //js操作 objSelect為select的name或者iddocument.getElementById('sel').value=objItemValue;

select下拉框的第二個元素為當前選中值

$('#select_id')[0].selectedIndex = 1;

2,單選框 radio :

$("input[type=radio][checked]").val(); //得到單選框的選中項的值(注意中間沒有空格)
$(':radio[name="radio"]:checked').val();//第二種方法

$("input[type=radio][value=2]").attr("checked",'checked'); //設置單選框value=2的為選中狀態.(注意中間沒有空格)
$(':radio[value="2"]').attr('checked','checked');

radio單選組的第二個元素為當前選中值

$("input[name='items']").get(1).checked = true;

3,復選框 checkbox :(其它寫法參見上面:radio)

$("input[type='checkbox'][checked]").val(); //得到復選框的選中的第一項的值
$("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);// 打勾
//全選/不選

 $("#selectAll").bind('click',function(){
   var sa = $(this).attr("checked");
   $("input[name='sel[]']").each(function(){
     this.checked=sa;
   });
 });

4,輸入框 input :

$(':input[name="keyword"]').val();//根據name值取得值

5,文本框 textarea :

固定文本框大小:
<textarea name="123" style="resize:none;"></textarea>

以上這篇javascript jquery對form元素的常見操作詳解就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved