标签: checked

使用 css 选中的选择器更改 div 颜色

当我尝试使用输入标签更改 div 的颜色时遇到一些问题。如果 div 位于输入的同一部分,它就完美无缺。但是,如果我尝试将 div 放在页脚中,例如,停止工作。

HTML:

 <section>
    <input id="select1" name="test" type="radio" checked />
        <label for="select1">Red</label>
    <input id="select2" name="test" type="radio" />
        <label for="select2">Green</label>
    <input id="select3" name="test" type="radio" />
        <label for="select3">Blue</label>
</section>
<footer>
    <div class="colorDiv"></div>
</footer>
Run Code Online (Sandbox Code Playgroud)

CSS:

.colorDiv{
    width:50px;
    height:50px;
    background-color:red;
}

#select2:checked ~ .colorDiv{
    background-color:green;
}

#select3:checked ~ .colorDiv{
    background-color:blue;
}
Run Code Online (Sandbox Code Playgroud)

这是一个例子:http : //jsfiddle.net/cqscc48g

有什么方法可以实现吗?

谢谢

css css-selectors checked

1
推荐指数
1
解决办法
2万
查看次数

Thymeleaf - 未在 th:each 中设置复选框的选中属性或如何正确恢复之前选中的复选框列表

在我的应用程序中,我想创建一个新的 Risk( Risk 对象的一个​​实例),当它被创建时,我想显示 5 个复选框和三个单选按钮。选定的选项特定于 Risk 对象的每个实例。

后来我想显示所有添加的风险的列表,每个风险上都有一个编辑选项按钮。我希望我的应用程序恢复特定于选定风险的视图(当单击选定风险上的“编辑”按钮时) - 风险名称、所有复选框和单选按钮均按先前选中的方式选中。我希望能够再次编辑这些复选框选择,以便所有新更改都正确反映在 MySQL 中。

作为 Thymeleaf 的新手,我做了以下事情:

<div th:each="top : ${topic}">
    <input type="checkbox" th:field="*{topic}" th:checked="${top.checked}" th:value="${top.name}"/><label th:text="${top.name}">Something is wrong !</label>
</div>
Run Code Online (Sandbox Code Playgroud)

我确定 Controller 和 Hibernate/MySQL 部分工作正常(我使用 Logs 进行了检查)。

这工作得很好 - 但前提是我只选择了一个复选框(最初是在我添加风险时)。

如果我选择了多个复选框(添加风险时),然后选择此风险进行编辑,则不会选中任何复选框。

怎么了 ?

checkbox spring radio-button checked thymeleaf

1
推荐指数
1
解决办法
7189
查看次数

jQuery - 选中复选框时隐藏/显示 div

我有一个 jquery 函数,可以在选中或取消选中某些复选框时显示或隐藏 div,并且使用“更改”函数可以正常工作。因此,如果之前已选中该复选框,则不会显示相应的 div。我怎样才能更改此代码以使其工作?

我的代码在这里:

<script>
    jQuery(document).ready(function($) {

        $('.my_features').change(function() {
            var checkbox = $(this);                 
            if( checkbox.is(':checked') ) {                       
                $( '#' + checkbox.attr('data-name') ).show();
            } else {                      
                $( '#' + checkbox.attr('data-name') ).hide();
            }
        });
    });
</script>
Run Code Online (Sandbox Code Playgroud)

javascript checkbox jquery checked

1
推荐指数
1
解决办法
6917
查看次数

启用禁用并在 android 中选中的自定义复选框

这是我的简单选择器

    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ic_square_blue_border_unselected" android:state_checked="false" />
    <item android:drawable="@drawable/ic_square_checkbox_selected" android:state_checked="true" />
    <item android:drawable="@drawable/ic_square_blue_border_unselected" />
</selector>
Run Code Online (Sandbox Code Playgroud)

当我添加state_enabled : false/true 时,它说,
“此项目无法访问,因为前一个项目是更一般的匹配”
……我不明白为什么会这样?因为我还添加了一个新属性 -> state_enabled ...我想如果两个属性都匹配然后只选择相应的可绘制对象。

我想做类似的事情,

checked && not disabled -> blue color checked box,
not checked && not disabled -> blue border unchecked box,
checked && disabled -> gray color checked box,
not checked &&  disabled -> gray color unchecked box
Run Code Online (Sandbox Code Playgroud)

而且, checkbox.setEnabled(false) 不适用于这种情况。这是我的 xml 代码。

<CheckBox
                        android:id="@+id/checkbox"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:button="@drawable/selector_chkbox_blue_border"
                        android:textColor="@color/steel_grey"
                        android:paddingLeft="10dp"
                        android:text="Checkbox text"/> …
Run Code Online (Sandbox Code Playgroud)

checkbox android selector checked disable

1
推荐指数
1
解决办法
1115
查看次数

检查是否选中了复选框jquery

有谁知道为什么这不起作用.它将始终打印'未选中'.

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

function msg(x)
{

if($(x).attr('checked')){
  alert('checked!!');
}
else{
  alert('unchecked');
}

}

</script>


</head>
<body>

<form>
<input type="checkbox" id="fname2" onClick="msg(this.id)" /><br/>

</form>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

checkbox jquery checked

0
推荐指数
1
解决办法
957
查看次数

带有复选框的敲除问题并检查并更改绑定

我刚刚发现了淘汰赛(3.0和3.1)和复选框的问题

问题是,复选框的更改事件绑定不会在不同的浏览器中一致地发生.

请参阅下面的代码

<table >
  <tr> 
    <td >
      <input type="checkbox" data-bind='checked: CheckVal, event: { change: refresh }' />
    </td>
    <td>Check Value in checked binding: <span data-bind="text: CheckVal"></span> 
    </td>
  </tr>
  <tr>
      <td></td>
    <td>Check Value in changed event binding: <span data-bind="text: CheckValChanged"></span> 
    </td>
    </tr>        
</table>
Run Code Online (Sandbox Code Playgroud)

和javascript

function MainViewModel() {
    var self = this;
    this.CheckVal = ko.observable(true);
    this.CheckValChanged = ko.observable(true);

    this.refresh = function() {
        self.CheckValChanged(self.CheckVal());
    }
}

viewModel = new MainViewModel();
ko.applyBindings(viewModel);
Run Code Online (Sandbox Code Playgroud)

在Firefox中,更改事件绑定发生在复选框值更改后,因此在更改事件处理程序中,我们可以读取复选框的实际值(即,如果选中复选框,则绑定字段的值为value = true).

在所有其他浏览器中(我使用Chrome,IE 11,Opera和Safari测试过),更改事件绑定似乎在实际更改绑定字段的值之前发生(即,选中复选框,在更改处理程序中读取的值)是false,如果未选中,则读取的值为true)

你可以在http://jsfiddle.net/bzamfir/su6SW/2/看到这个问题.

问题不仅在于浏览器中的行为不一致,而且对于大多数浏览器而言,这似乎是违反直觉的:事件是变化 …

data-binding binding onchange checked knockout.js

0
推荐指数
1
解决办法
3355
查看次数

如果选中表格复选框,请取消选中其他表格复选框?

我有很多表,当一个复选框被选中时 - 所有其他表应该清除.您可以在此表中检查任意数量的复选框,但只能一次检查一个表中的复选框.我该怎么做呢?我希望尽可能避免使用id,因为我有8个表.

http://jsfiddle.net/69o3e5y4/

$('input[type=checkbox]').on('click', function () {

});
Run Code Online (Sandbox Code Playgroud)

javascript checkbox jquery this checked

0
推荐指数
1
解决办法
702
查看次数

jQuery 检查复选框值是否在数组中

我有一个用户 ID 数组,如下所示:

var taskAssignTo = jQuery(this).attr('data-assigned');
var userArray = new Array();
userArray = taskAssignTo.split(",");
Run Code Online (Sandbox Code Playgroud)

这会获取存储在“数据分配”属性中的 id 字符串,这些 id 之间用逗号分隔。

我已尝试以下方法来检查每个复选框(如果它的值在数组中),如下所示:

jQuery( ".assignTo input" ).each(function( index ) {
    var val = jQuery( this ).val();         
    if(jQuery.inArray(val, userArray)){
        jQuery( this ).prop('checked', true);
    }     
});
Run Code Online (Sandbox Code Playgroud)

但是,这仅检查数组中的最后一项。

如果我喜欢console.log(val)这样:

jQuery( ".assignTo input" ).each(function( index ) {
    var val = jQuery( this ).val();         
    console.log(val);
    if(jQuery.inArray(val, userArray)){
        jQuery( this ).prop('checked', true);
    }     
});
Run Code Online (Sandbox Code Playgroud)

我可以看到数组的所有结果都是从“数据分配”属性返回的。如果我将 console.log(val) 移至此处:

jQuery( ".assignTo input" ).each(function( index ) {
    var val …
Run Code Online (Sandbox Code Playgroud)

arrays each jquery checked

0
推荐指数
1
解决办法
2139
查看次数