checkbox 相关问题

复选框是一个图形用户界面元素,允许用户进行二进制选择。

如何从Facets-CheckBox Group中获取选中的值?

我在“120 - 机场分面搜索”页面上使用 ORACLE APEX“示例地图”示例。 我需要从 Facet“P120_STATE”获取选中的选项(这是一个复选框...

回答 1 投票 0

将状态设置为单选按钮标签的值

我有一个表单中的单选按钮列表。 所需品种(如果有) ... 我有一个表单中的单选按钮列表。 <h6>Desired breed (if any)</h6> <div className="radio container-fluid"> <label> <input type="radio" className="checkbox" name="Breed" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Goldendoodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">English Goldendoodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Labradoodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Poodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Other</p> </label> <label> <input type="radio" className="checkbox" name="Breed" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">No preference</p> </label> </div> </label> </div> 我想做的是将 Breed 变量设置为所选复选框的值。问题是我得到的值是 on,而不是标签上的内容。 我无法更改单选按钮的名称属性,因为我一次只需要选择一个。 (我也愿意接受其他方法来实现这一目标)。 尝试像这样改变onClick: onClick={(e) => setBreed(e.target.nextSibling.textContent)} <input type="radio" />元素没有任何值,这就是使用"on"的原因。当为每个 value 提供 <input /> 属性时,您可以看到状态正确更新。 这还允许您将实际值与显示的标签分开。例如,假设您的界面有多种语言版本。在这种情况下,您将为每种语言使用不同的标签,但值将保持不变。 function App() { const [breed, setBreed] = React.useState(null); console.log(breed); return ( <div> <h6>Desired breed (if any)</h6> <div className="radio container-fluid"> <label> <input type="radio" className="checkbox" name="Breed" value="Goldendoodle" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Goldendoodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" value="English Goldendoodle" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">English Goldendoodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" value="Labradoodle" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Labradoodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" value="Poodle" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Poodle</p> </label> <label> <input type="radio" className="checkbox" name="Breed" value="Other" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">Other</p> </label> <label> <input type="radio" className="checkbox" name="Breed" value="No preference" onClick={(e) => setBreed(e.target.value)} /> <p className="checkbox">No preference</p> </label> </div> </div> ); } ReactDOM.render(<App />, document.querySelector("#root")); <script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script> <script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script> <div id="root"></div>

回答 2 投票 0

确保至少选中一个复选框的 VBA 代码

我有一个从原始表单(frmForm)打开的表单(标题为ReplacedParts),它使用复选框来跟踪重建时替换了哪些部分。总共 26 个复选框。选择

回答 1 投票 0

jQuery 复选框选中限制

我在一组食物方面有 6 个复选框。可以检查六个中的任何一个或全部。 我还有另一组 6 个酱汁复选框,只能选中一个。在特定条件下,蛋卷

回答 1 投票 0

复选框/提交逻辑问题

我已经使用 tkinter 为我的工作应用程序部署程序创建了一个 GUI。我的两个复选框有问题。我相信出于某种原因,我的“提交”按钮的逻辑正在变得

回答 1 投票 0

向复选框添加属性,以便它可以触发按钮单击事件

我的页面上有一个按钮,可以触发更新面板。当我单击

回答 1 投票 0

如何修改下面的闪亮代码来获取复选框选中的行索引?

我有兴趣在我闪亮的应用程序中拥有如下数据表。使用复选框选择行后,我想继续处理所选数据。现在的问题是我...

回答 1 投票 0

在 RedCAP 中处理复选框答案时,分支逻辑是如何编码的?

这是我在到达复选框一之前对其中一个问题的进度条的分支逻辑:(这有效) ([年龄]<>"" AND [教育]="" AND [

回答 1 投票 0

在React.js中检索复选框的值

我想在选中复选框时检索它的值。 我正在使用这个“http://react-component.github.io/checkbox/”。 我的代码看起来像这样。 {检查... 我想在选中复选框时检索它的值。 我正在使用这个“http://react-component.github.io/checkbox/”。 我的代码看起来像这样。 <div className="user_box"> { check.map((values , i)=> { return <Checkbox name = "checkbox" onChange={this.checkvalue.bind(this)} value={values.username} /> })} </div> 我的功能: checkvalue(e){ // var all_users = []; // var value = this.checkbox.value; // all_users.push(value); // console.log(all_users); console.log('checkbox checked:', (e.target.checked)); } 我不明白如何检索复选框的值。 您需要将“e,综合事件参数传递给您的处理程序”: handleChange(e) { let isChecked = e.target.checked; // do whatever you want with isChecked value } render() { // ... your code here return ( {/* your other jsx here */} <Checkbox otherProps onChange={e => this.handleChange(e)} /> {/* your other jsx here */} ); } 使用综合事件参数,这里是一个示例: const element1 = "boy"; const element2 = "girl"; <input type="checkbox" name={element1} value={element1} onChange={this.handleChange} /> <label for="element" style={{ fontSize: 35 }}> {element2} </label> <input type="checkbox" name={element2} value={element2} onChange={this.handleChange} /> <label for="element" style={{ fontSize: 35 }}> {element2} </label> handleChange = (e) => { // to find out if it's checked or not; returns true or false const checked = e.target.checked; // to get the checked value const checkedValue = e.target.value; // to get the checked name const checkedName = e.target.name; //then you can do with the value all you want to do with it. }; 试试这个: getChckeboxValue(event) { const value = event.target.value; } 渲染中: <input onClick={this.getChckeboxValue.bind(this)} type="checkbox" value="Text" /> 我们可以通过在输入元素属性上声明 onChange={this.likeClicked} defaultChecked={false} 来获取复选框值 constructor(props){ super(props) this.likeClicked = this.likeClicked.bind(this) } likeClicked(){ console.log(event.target.checked, event.target.id); } render(){ return ( <div className='px-3'> <div className='item-header item-wrapper cirle'> <input type="checkbox" onChange={this.likeClicked} defaultChecked={false} className="checkbox" id={`checkbox_${this.props.product.sku}`} /> <label htmlFor={`checkbox_${this.props.product.sku}`}> <HeartIcon className="heart-svg"></HeartIcon> </label> </div> </div> ); } 一个衬垫: onChange={e => doSomethingWithValue( e.currentTarget.checked )} 如果您必须使用输入等现有表单数据来获取复选框状态值,请选择。这是代码 const onChangeHandler = (e) => { const formFieldValue = e.target.type === 'checkbox' ? e.target.checked : e.target.value setFormValues({ [e.target.name]: formFieldValue, }) }

回答 6 投票 0

在 Streamlit 的复选框中选择多个选项

我是 Streamlit 的新手。我想进行多项选择用户输入(复选框)。但我想从 4 个选项中最多选择 3 个。 我尝试过多选的下拉功能。

回答 3 投票 0

JavaFX 复选框的复选框右对齐

我想将复选框的 .box 部分向右对齐。它只是图形,因此没有文字。这是一张图片,我将 .check-box 设置为浅蓝色背景,这样我就可以看到 e...

回答 1 投票 0

如何编写多个“hideRows”命令的脚本?

我的目标是创建一个复选框,每个月在其下方隐藏几行信息。 我对编码知之甚少,但已经成功地编写了一个简单的代码......

回答 1 投票 0

如何保持复选框的状态?

我有 3 个不同组(A 组、B 组和 C 组)的用户列表,我可以按他们的名字进行搜索。每个用户旁边都有一个复选框。我的问题是,即使我点击复选框(

回答 1 投票 0

调用notifyDataSetChanged时,仅更新RecyclerView中的最后一项

我想建立一个具有选择功能的分段列表。 为此,我的布局文件中有多个 RecyclerView(例如 5 个),并且每个 RecyclerView 的数据列表都是动态的。正如您在...中看到的那样。

回答 1 投票 0

离子2段,内容消失

我在我的一个页面中创建了分段选项。代码如下: 我在我的一个页面中创建了分段选项。代码如下: <div padding> <ion-segment [(ngModel)]="accion"> <ion-segment-button value="crear"> Crear zona </ion-segment-button> <ion-segment-button value="modificar"> Modificar zona </ion-segment-button> </ion-segment> </div> <ion-card center *ngIf="accion=='crear'"> <ion-card-content> <ion-list> <ion-item> <ion-label floating> Nombre del area: </ion-label> <ion-input type="text" [(ngModel)]="nombreArea"> </ion-input> </ion-item> <ion-item> <label>Dispositivo asociado:</label> <ion-list> <ion-item *ngFor="let dispositivo2 of dispositivosAnadir"> <ion-label> {{dispositivo2.name}} </ion-label> <ion-checkbox color="royal" [(ngModel)]="dispositivo2.selected" value="dispositivo2.value"></ion-checkbox> </ion-item> </ion-list> </ion-item> </ion-list> <div padding> <button (click)="marcarTodos()" ion-button icon-left color="royal"> <ion-icon name="checkmark-circle"></ion-icon> Marcar todos </button> <button (click)="desmarcarTodos()" ion-button icon-left color="royal"> <ion-icon name="radio-button-off"></ion-icon> Desmarcar todos </button> </div> <div padding> <button (click)="startShape()" [disabled]="pintando" ion-button icon-left color="royal"> <ion-icon name="brush"></ion-icon> Pintar zona </button> <button (click)="endShape()" [disabled]="!pintando" ion-button icon-left color="royal"> <ion-icon name="flag"></ion-icon> Fin pintar zona </button> <button (click)="cancelShape()" [disabled]="!pintando" ion-button icon-left color="royal"> <ion-icon name="close"></ion-icon> Cancelar </button> </div> </ion-card-content> </ion-card> <ion-card center *ngIf="accion=='modificar'"> <ion-card-content> <ion-list> <ion-item> <ion-label>Seleccionar zona: </ion-label> <ion-select [(ngModel)]="zonasSelector.seleccionada" (ionChange)="cambioZonaSeleccionada()"> <ion-option *ngFor="let zona of zonasSelector.array" [value]="zona.value">{{zona.name}}</ion-option> </ion-select> </ion-item> <ion-item> <ion-list> <ion-item *ngFor="let dispositivo of dispositivosModificar"> <ion-label> {{dispositivo.name}} </ion-label> <ion-checkbox color="royal" [(ngModel)]="dispositivo.selected" value="dispositivo.value" [disabled]="zonasSelector.seleccionada == null"></ion-checkbox> </ion-item> </ion-list> </ion-item> </ion-list> <div padding> <button ion-button icon-left (click)="modificarZona()" [disabled]="zonasSelector.seleccionada == null" color="royal"> <ion-icon name="checkmark"></ion-icon> Modificar </button> <button ion-button icon-left (click)="showConfirmDelete()" [disabled]="zonasSelector.seleccionada == null" color="royal"> <ion-icon name="trash"></ion-icon> Eliminar </button> </div> </ion-card-content> </ion-card> 之前,我在不分段显示内容的情况下效果很好,但是当分段引入时我遇到了问题。问题是,在这两个段上,我都有一个 ngFor 来表示一组复选框,并且第一次加载页面时,检查显示得很好,但如果我更改段,无论我选择哪个,复选框都会消失。 有人有想法吗? 如果有人感兴趣,我已经解决了这个问题,用 ngFor 取出离子列表并将其添加到离子卡内容中,而不是第一个离子列表中。 <!-- SEGMENTOS --> <div padding> <ion-segment [(ngModel)]="accion"> <ion-segment-button value="crear"> Crear zona </ion-segment-button> <ion-segment-button value="modificar"> Modificar zona </ion-segment-button> </ion-segment> </div> <!-- CREAR ZONA --> <ion-card center *ngIf="accion=='crear'"> <ion-card-content> <ion-list> <ion-item> <ion-label floating> Nombre del area: </ion-label> <ion-input type="text" [(ngModel)]="nombreArea"> </ion-input> </ion-item> </ion-list> <div padding> <label>Dispositivo asociado:</label> <ion-list> <ion-item *ngFor="let dispositivo2 of dispositivosAnadir"> <ion-label> {{dispositivo2.name}} </ion-label> <ion-checkbox color="royal" [(ngModel)]="dispositivo2.selected" value="dispositivo2.value"></ion-checkbox> </ion-item> </ion-list> </div> <div padding> <button (click)="marcarTodos()" ion-button icon-left color="royal"> <ion-icon name="checkmark-circle"></ion-icon> Marcar todos </button> <button (click)="desmarcarTodos()" ion-button icon-left color="royal"> <ion-icon name="radio-button-off"></ion-icon> Desmarcar todos </button> </div> <div padding> <button (click)="startShape()" [disabled]="pintando" ion-button icon-left color="royal"> <ion-icon name="brush"></ion-icon> Pintar zona </button> <button (click)="endShape()" [disabled]="!pintando" ion-button icon-left color="royal"> <ion-icon name="flag"></ion-icon> Fin pintar zona </button> <button (click)="cancelShape()" [disabled]="!pintando" ion-button icon-left color="royal"> <ion-icon name="close"></ion-icon> Cancelar </button> </div> </ion-card-content> </ion-card> <!-- MODIFICAR ZONA --> <ion-card center *ngIf="accion=='modificar'"> <ion-card-content> <ion-list> <ion-item> <ion-label>Seleccionar zona: </ion-label> <ion-select [(ngModel)]="zonasSelector.seleccionada" (ionChange)="cambioZonaSeleccionada()"> <ion-option *ngFor="let zona of zonasSelector.array" [value]="zona.value">{{zona.name}}</ion-option> </ion-select> </ion-item> </ion-list> <ion-list> <ion-item *ngFor="let dispositivo of dispositivosModificar"> <ion-label> {{dispositivo.name}} </ion-label> <ion-checkbox color="royal" [(ngModel)]="dispositivo.selected" value="dispositivo.value" [disabled]="zonasSelector.seleccionada == null"></ion-checkbox> </ion-item> </ion-list> <div padding *ngIf="accion=='modificar'"> <button ion-button icon-left (click)="modificarZona()" [disabled]="zonasSelector.seleccionada == null" color="royal"> <ion-icon name="checkmark"></ion-icon> Modificar </button> <button ion-button icon-left (click)="showConfirmDelete()" [disabled]="zonasSelector.seleccionada == null" color="royal"> <ion-icon name="trash"></ion-icon> Eliminar </button> </div> </ion-card-content> </ion-card>

回答 1 投票 0

c# WPF MVVM:复选框不会触发事件“已选中”或“未选中”

我是 MVVM 模式的新手,我在列表视图内的复选框中遇到了问题。 当我将复选框作为项目放入列表视图时,事件“已选中”和“未选中”不会...

回答 3 投票 0

在 Shinly ggplot2 中添加或删除多条水平线

我有一个闪亮的应用程序,可以绘制上传文件中的数据。我在应用程序中有几个 checkboxInput 和几个相应的 numericInput。使用 numericInputs 绘图效果很好,如下所示

回答 1 投票 0

在 React Hook 表单中进行验证以确保至少选中一个复选框?

我正在制作一个表单,其中有一部分需要至少选中一个复选框。我正在使用 ReactJS 和 React Hook Form。 这是代码的复选框部分...

回答 2 投票 0

向 Excel 工作表中的所有复选框添加背景色宏

我有一个包含大量复选框的 Excel 工作表。为了提高视觉清晰度,我希望给定复选框的 BackColor 属性在选中时发生变化(并在

回答 1 投票 0

物化中复选框的重叠问题

我建立了一个测验网站,并使用“Materialize”进行设计。 现在我遇到的问题是答案的文本相互覆盖。复选框之间的距离...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.