CheckBoxList 獲取選中的值或判斷被選中項

最新推荐文章于 2019-09-22 11:34:00 发布

Marvin Zhong

最新推荐文章于 2019-09-22 11:34:00 发布

阅读量1.6k

点赞数

分类专栏： javascript ASP.NET 文章标签： javascript

本文链接：https://blog.csdn.net/marvin198801/article/details/8700360

版权

ASP.NET 同时被 2 个专栏收录

13 篇文章 0 订阅

订阅专栏

javascript

6 篇文章 0 订阅

订阅专栏

RepeatLayout

使用该属性指定是否在表中显示CheckBoxList控件中的项。如果该属性设置为RepeatLayout.Table，则在表中显示列表项。如果该属性设置为 RepeatLayout.Flow，则不以表结构的形式显示列表项。

下面舉例:

前臺頁面:

<body>

<formid="form1"runat="server">

<div>

<asp:CheckBoxList ID="chkTestTable"runat="server"RepeatDirection="Horizontal"RepeatLayout="Table">

<asp:ListItemValue="0">外語水平</asp:ListItem>

<asp:ListItemValue="1">技能水平</asp:ListItem>

<asp:ListItemValue="2">人際交流水平</asp:ListItem>

</asp:CheckBoxList>

<br/>

<asp:CheckBoxListID="chkTestFlow"runat="server"RepeatDirection="Horizontal"RepeatLayout="Flow">

<asp:ListItemValue="0">外語水平</asp:ListItem>

<asp:ListItemValue="1">技能水平</asp:ListItem>

<asp:ListItemValue="2">人際交流水平</asp:ListItem>

</asp:CheckBoxList>

<br/>

<asp:ButtonID="btnTest"runat="server"Text="Test" OnClientClick="return GetChkChoose();"/>

</div>

</form>

</body>

源代碼:

1.RepeatLayout="Table":

<tr>

<td>

</td>

<td>

</td>

<td>

<label for="chkTestTable_2">人際交流水平</label>

</td>

</tr>

</table>

<br/>

2.RepeatLayout="Flow":

<label for="chkTestFlow_2">人際交流水平</label></span>

<br/>

从上面的分析可知，当RepeatLayout="Table"时，CheckBoxList自动解析成table，<td>中含有两个子元素，一个是type="checkbox"一个是label，所以若是在js中获取到谁被选中，则要

var checkChoose = document.getClientmentById("chkTestTable");

for(i=0;i<checkChoose.cells.length;i++)

{

// 获取table中的每一个单元格内的第一个元素，然后判断其选中状态

if(checkChoose.cells[i].children[0].checked)

{

alert（“http://hi.baidu.com/new/zhong635976601”）；

}

// 那么获取选中的内容肯定就是checkChoose.cells[i].children[1].innerText,這裡不可用.value取值,因為這裡的標記為<label>,所以要用innerText或innerHTML

}

当RepeatLayout="Flow"时

看源代碼,被編譯成為<span>標記,裏面的子元素為三个是type="checkbox"三个是label,並沒有像RepeatLayout="Table"一樣被<td>標記分成三組,而是直接在一個<span>標記中,所以在這裡<span>標記中就有了6個元素,其中三個是checkbox,另外三個是checkbox的值,所以若是想獲取誰選中了,則

for (i = 0; i < chkTestFlow.children.length / 2; i++)
            {
                if (chkTestFlow.children[2 * i].checked)
                {
                    alert("http://hi.baidu.com/new/zhong635976601");

                    return;
                }
            }

// 那么获取选中的内容肯定就是chkTestFlow.children[2 * i +1].innerText,這裡不可用.value取值,因為這裡的標記為<label>,所以要用innerText或innerHTML

radioButtonList的使用和checkBoxList的使用基本一致,在這裡不再講解,你是否已經明白怎麼處理了呢.

不明白的可以留言....

Marvin Zhong

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CheckBoxList 獲取選中的值或判斷被選中項

RepeatLayout使用该属性指定是否在表中显示CheckBoxList控件中的项。如果该属性设置为RepeatLayout.Table，则在表中显示列表项。如果该属性设置为 RepeatLayout.Flow，则不以表结构的形式显示列表项。下面舉例: 前臺頁面:body> formid="form1"runat="server"> div>
复制链接

扫一扫