单选框,获取选中的值[iCheck]

Question

基本收音机盒

<div class="adv_filter">
    <li>
        <input type="radio" name="letter_type" data-custom="Text" value="0"> Text</li>
    </li>
        <li>
            <input type="radio" name="letter_type" data-custom="Text" value="0"> Text</li>
    </li>
</div>

iCheck转换

<!-- iCheck output format
<div class="adv_filter">
    <li>
        <div class="iradio_square-orange checked" aria-checked="true" aria-disabled="false" style="position: relative;"><input type="radio" name="letter_type" data-custom="Text" value="0" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"><ins class="iCheck-helper" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> Text</li>

        <li>
            <div class="iradio_square-orange" aria-checked="false" aria-disabled="false" style="position: relative;"><input type="radio" name="letter_type" data-custom="Text" value="0" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"><ins class="iCheck-helper" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> Text</li>

</div> -->

如您所见,已选中已附加到div ..

    $(document).ready(function () {
        $('input').iCheck({
            checkboxClass: 'icheckbox_square-orange',
            radioClass: 'iradio_square-orange',
            increaseArea: '20%' // optional
        });
        $("li").on("click", "input", function () {
            var val = $(this).val();
            //updateDataGrid(val);
            alert(val);
        });

    });

问题和描述

在添加icheck插件之前,如果javascript代码正常工作, 我想知道如何在icheck插件中获得相同的结果.它简单,在无线电点击它存储值变量后,它进一步传递给函数.

实例:http://jsfiddle.net/9ypwjvt4/

iCheck:http://fronteed.com/iCheck/

Answer 1

将处理程序附加到ifChanged事件:

$('input').on('ifChecked', function(event){
  alert($(this).val()); // alert value
});

有11种方法可以监听变化:

• ifClicked - 用户单击自定义输入或指定的标签
• ifChanged - 输入已检查,已禁用或不确定状态已更改
• ifChecked - 输入的状态更改为已选中
• ifUnchecked - 已删除已检查状态
• ifToggled - 输入的检查状态已更改
• ifDisabled -input的状态更改为禁用
• ifEnabled - 删除了禁用状态
• ifIndeterminate - 输入的状态更改为不确定
• ifDeterminate - 删除不确定状态
• ifCreatedinput - 只是定制
• ifDestroyed - 刚刚删除了自定义

的jsfiddle

Answer 2

尽可能避免使用jquery.您也可以使用以下代码;

$('input').on('ifChecked', function(event){
    alert(event.target.value); // alert value
});