checkbox实例（js实现checkbox全选、不选与反选的方法）

本文目录

• js实现checkbox全选、不选与反选的方法
• emwin中checkbox怎么用

js实现checkbox全选、不选与反选的方法

本文实例讲述了js实现checkbox全选、不选与反选的方法。分享给大家供大家参考。具体分析如下：
一、思路：
1.
获取元素
2.
给全选
不选
反选添加点击事件
3.
用for循环checkbox
4.
把checkbox的checked设置为true即实现全选
5.
把checkbox的checked设置为false即实现不选
6.
通过if判断，如果checked为true选中状态的，就把checked设为false不选状态，如果checked为false不选状态的，就把checked设为true选中状态。
二、html代码：
《input
type="button"
value="全选"
id="sele"/》
《input
type="button"
value="不选"
id="setinterval"/》
《input
type="button"
value="反选"
id="clear"/》
《div
id="checkboxs"》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《input
type="checkbox"/》《br
/》
《/div》
三、js代码：
《script》
window.onload=function(){
var
sele=document.getElementById(’sele’);//获取全选
var
unsele=document.getElementById(’setinterval’);//获取不选
var
clear=document.getElementById(’clear’);//获取反选
var
checkbox=document.getElementById(’checkboxs’);//获取div
var
checked=checkbox.getElementsByTagName(’input’);//获取div下的input
//全选
sele.onclick=function(){
for(i=0;i《checked.length;i++){
checked.checked=true
}
}
//不选
unsele.onclick=function(){
for(i=0;i《checked.length;i++){
checked.checked=false
}
}
//反选
clear.onclick=function(){
for(i=0;i《checked.length;i++){
if(checked.checked==true){
checked.checked=false
}
else{
checked.checked=true
}
}
}
}
《/script》
希望本文所述对大家的javascript程序设计有所帮助。

emwin中checkbox怎么用

复选框是选择各种不同选项的最常用控件之一。用户可选中或取消选中复选框，并且可一次选中任意个框。使用键盘界面时，被聚焦的复选框的状态可使用《SPACE》键切换。禁用的框显示为灰色，如下图所示，其中描述了每种可能的复选框的外观：

开启皮肤色后显示效果如下：

41.2 官方WIDGET_CheckBox实例
官方的这个例子做的很好，充分的演示了复选框的各个状态。这个例子在模拟器中的位置：

41.2 源代码如下（主要看WIDGET_Checkbox中的代码）：
#include 《stddef.h》
#include "GUI.h"
#include "DIALOG.h"
#include "Main.h"
/*********************************************************************
*
* Static data
*
**********************************************************************
*/
//
// Dialog resource
//
static const GUI_WIDGET_CREATE_INFO _aDialogCreate = {（1）
{ FRAMEWIN_CreateIndirect, "Check box sample", 0, 10, 10, 300, 220, FRAMEWIN_CF_MOVEABLE},
{ TEXT_CreateIndirect, "Enabled:", 0, 5, 10, 120, 0 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK0, 5, 30, 120, 0 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK1, 5, 60, 120, 0 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK2, 5, 90, 120, 20 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK3, 5, 125, 120, 26 },
{ TEXT_CreateIndirect, "Disabled:", 0, 150, 10, 120, 0 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK4, 150, 30, 120, 0 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK5, 150, 60, 120, 0 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK6, 150, 90, 120, 26 },
{ CHECKBOX_CreateIndirect, 0, GUI_ID_CHECK7, 150, 125, 120, 26 },
{ BUTTON_CreateIndirect, "OK", GUI_ID_OK, 10, 170, 60, 20 },
{ BUTTON_CreateIndirect, "Cancel", GUI_ID_CANCEL, 225, 170, 60, 20 },
};
//
// Check box text
//
static const char * _apLabel = {（2）
"Default",
"3 States",
"Box XL",
"Box XXL"
};
/*********************************************************************
*
* Static code
*
**********************************************************************
*/
/*********************************************************************
*
* _cbCallback
*/
static void _cbCallback(WM_MESSAGE * pMsg) {
WM_HWIN hDlg;
WM_HWIN hItem;
int i;
int NCode;
int Id;
hDlg = pMsg-》hWin;
switch (pMsg-》MsgId) {
case WM_INIT_DIALOG:
WM_GetDialogItem(hDlg, GUI_ID_CHECK0);
for (i = 0; i 《 8; i++) {（3）
int Index = i % 4;
hItem = WM_GetDialogItem(hDlg, GUI_ID_CHECK0 + i); // Get the handle of the desired checkbox
CHECKBOX_SetText(hItem, _apLabel); // Set the check box text（4）
switch (Index) {
case 1:（5）
//
// Set the number of possible states to 3
//
CHECKBOX_SetNumStates(hItem, 3);（6）
//
// Use user defined bitmaps for the third state
//（7）
CHECKBOX_SetImage(hItem, &_abmBar, CHECKBOX_BI_INACTIV_3STATE); // Used if widget is disabled
CHECKBOX_SetImage(hItem, &_abmBar, CHECKBOX_BI_ACTIV_3STATE); // Used if widget is enabled
CHECKBOX_SetState(hItem, 2);（8）
break;
case 2:（9）
CHECKBOX_SetState(hItem, 1);
//
// Use user defined bitmaps for the ’checked’ state
//
CHECKBOX_SetImage(hItem, &_abmXL, CHECKBOX_BI_INACTIV_CHECKED); // Used if widget is disabled
CHECKBOX_SetImage(hItem, &_abmXL, CHECKBOX_BI_ACTIV_CHECKED); // Used if widget is enabled 
CHECKBOX_SetFont(hItem, &GUI_FontComic18B_ASCII);
break;
case 3:（10）
CHECKBOX_SetState(hItem, 1);
//
// Use user defined bitmaps for the ’checked’ state
//
CHECKBOX_SetImage(hItem, &_abmXXL, CHECKBOX_BI_INACTIV_CHECKED); // Used if widget is disabled
CHECKBOX_SetImage(hItem, &_abmXXL, CHECKBOX_BI_ACTIV_CHECKED); // Used if widget is enabled 
CHECKBOX_SetFont(hItem, &GUI_FontComic24B_ASCII);
break;
}
//
// Disable all check boxes shown on the right side of the dialog
//
if (i 》= 4) {（11）
WM_DisableWindow(hItem);
}
}
break;
case WM_NOTIFY_PARENT:
Id = WM_GetId(pMsg-》hWinSrc); // Id of widget
NCode = pMsg-》Data.v; // Notification code
switch (NCode) {
case WM_NOTIFICATION_RELEASED: // React only if released
if (Id == GUI_ID_OK) { // OK Button
GUI_EndDialog(hDlg, 0);
}
if (Id == GUI_ID_CANCEL) { // Cancel Button
GUI_EndDialog(hDlg, 1);
}
break;
}
break;
default:
WM_DefaultProc(pMsg);
}
}
/*********************************************************************
*
* Public code
*
**********************************************************************
*/
/*********************************************************************
*
* MainTask
*/
void MainTask(void) {
#if GUI_SUPPORT_MEMDEV
WM_SetCreateFlags(WM_CF_MEMDEV);
#endif
GUI_Init();
WM_SetDesktopColor(GUI_BLACK);
while (1) {
GUI_ExecDialogBox(_aDialogCreate, GUI_COUNTOF(_aDialogCreate), &_cbCallback, 0, 0, 0);
GUI_Delay(500);
}
}

41.1.1 复选框支持的通知代码
以下事件是复选框控件作为WM_NOTIFY_PARENT消息的一部分发送给其父窗口的：
消息 描述 
WM_NOTIFICATION_CLICKED 复选框已被点击。 
WM_NOTIFICATION_RELEASED 复选框已被释放。 
WM_NOTIFICATION_MOVED_OUT 复选框已被点击，且指针已移出复选框并且没有释放。 
WM_NOTIFICATION_VALUE_CHANGED 复选框的状态已改变。 
41.1.2 按钮支持键盘反应
如果控件具有输入焦点，则它将对下列各键做出反应：
按键 反应 
GUI_KEY_SPACE 切换小工具的选中状态