javascript - 如果未选中复选框,如何禁用按钮

标签 javascript jquery angularjs model-view-controller input

我得到了以下 Angular 模板:

<tr ng-repeat="user in users">
    <td><input type="checkbox"></td>
    <td>{{user.username}}</td>
    <td>{{user.apiKey}}</td>
    <td>{{user.apiSecret}}</td>
</tr>
...
<button type="button" class="btn btn-danger"><i class="fa fa-trash-o"></i></button>

如果没有选中复选框,我如何禁用该按钮,但只要选中表格中的一个或多个复选框,我就可以启用它?

我如何确定检查了哪个表条目并访问用户数据?

最佳答案

Angular 的方式是使用 ng-disabled .作为一个例子,你可以使用这个:

ng-disabled="!checked"

!意思是做相反的事情,所以 !true == false = true

完整示例:

<td>
   <input type="checkbox" ng-model="checked"
</td> 

<button class="btn btn-danger" ng-disabled="!checked"><i class="fa fa-trash-o"></i>Submit</button>

在此处阅读有关 ng-disabled 的更多信息:

https://docs.angularjs.org/api/ng/directive/ngDisabled

什么是HTML属性checked ?

The checked attribute is a boolean attribute.

When present, it specifies that an element should be pre-selected (checked) when the page loads.

The checked attribute can be used with and <input type="radio">.

CODEPEN DEMO

关于javascript - 如果未选中复选框,如何禁用按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33587471/

相关文章:

javascript - 如何强制 JavaScript 等待动态添加的脚本文件完成加载?

javascript - 如何从表格单元格按钮单击中获取行号?

javascript - 在 AngularJS Controller 和指令中使用 "this"而不是 "scope"

javascript - Chart.js 2 - 标签重叠

javascript - ngCordova:oauth 与谷歌失败

javascript - 获取 Angular JS中的复选框数组值

javascript - 如何在 ReactJS 中的 Whatsapp 上共享带有文本的图像?

javascript - 根据窗口高度 Bootstrap 模态高度

javascript - 使用带有数字问题的正则表达式拆分字符串

javascript - 拆分选项卡标题不删除事件状态