當前位置:首頁 >  站長 >  編程技術 >  正文

Jquery操作radio、checkbox、selelct選中及獲取選中值

 2020-10-29 09:39  來源: 馮奎博客   我來投稿 撤稿糾錯

  域名預訂/競價,好“米”不錯過

在我們編寫程序的時候,經常會對元素選中,或是獲取選中的值,

在這篇文章中,我們介紹使用 Jquery 操作radio、checkbox、select選中及獲取選中值,

獲取選中的值時,我們使用 val() 來獲取,

元素的選中 我們使用 attr 或 poro 來進行屬性操作,

下面就是具體使用示例:

一、Radio 單選框

1、獲取選中的值

$("input[name='name名稱']:checked").val();

2、操作選中使用(attr 或 poro)

$("input[name='sex']").attr("checked", true); // 選中

$("input[name='sex']").attr("checked", false); // 取消選中

3、判斷是否選中

// 選中為true,沒選中為false

$("input[type='radio']:eq(1)").prop("checked");

$("input[type='radio']:eq(1)").is(":checked");

二、Checkbox 復選框

1、獲取選中的值

$("input[type='checkbox']:checked").each(function(){

console.log($(this).val());

})

2、操作選中使用(attr 或 poro)

$("input[type='checkbox']:eq(1)").attr("checked", true); // 選中

$("input[type='checkbox']:eq(1)").attr("checked", false); // 取消選中

3、判斷是否選中

// 選中為true,沒選中為false

$("input[type='checkbox']:eq(1)").prop("checked");

$("input[type='checkbox']:eq(1)").is(":checked");

三、Select 下拉框

1、獲取選中的值

$("select option:selected").text()

$("select").find('option:selected').text()

$("select").val();

2、操作選中使用(attr 或 poro)

$("select option:eq(1)").attr("selected", true); // 選中

$("select option:eq(1)").attr("selected", false); // 取消選中

3、判斷是否選中

// 選中為true,沒選中為false

$("select option:eq(1)").is(":selected");

文章轉自馮奎博客,原文鏈接:https://fengkui.net/article/141

申請創(chuàng)業(yè)報道,分享創(chuàng)業(yè)好點子。點擊此處,共同探討創(chuàng)業(yè)新機遇!

相關標簽
jquery教程

相關文章

  • jQuery使用hide() toggle()函數實現相機品牌展示隱藏功能

    這篇文章主要介紹了jQuery使用hide()、toggle()函數實現相機品牌展示隱藏功能,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下

    標簽:
    jquery教程
  • jQuery使用contains過濾器實現精確匹配的方法

    :contains選擇器選取包含指定字符串的元素。該字符串可以是直接包含在元素中的文本,或者被包含于子元素中。經常與其他元素/選擇器一起使用,來選擇指定的組中包含指定文本的元素。

    標簽:
    jquery教程
  • jQuery實現鼠標拖拽登錄框移動效果

    這篇文章主要為大家詳細介紹了jQuery實現鼠標拖拽登錄框移動效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下

    標簽:
    jquery教程
  • jQuery實現帶進度條的輪播圖

    這篇文章主要為大家詳細介紹了jQuery實現帶進度條的輪播圖,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下

    標簽:
    jquery教程
  • jQuery具體實例介紹什么時候用ajax,ajax應該在什么地方使用

    網站開發(fā)時,ajax是一個非常方便的工具,它具有和表單相同的功能完成前端和后臺之間的交互!它起到局部刷新的功能!那什么時候用ajax呢?下面給大家介紹幾個實例,首先應該分為兩類:一、在用表單和ajax都可以完成某個功能時,只是使用ajax更加的快速、方便。1,在網站文章下面的評論上面使用ajax!它

    標簽:
    jquery教程

熱門排行

信息推薦