如何从单选按钮中删除选择?

时间:2018-02-25 13:18:54

标签: javascript jquery

我需要使用JQuery从复选框中删除选择。

这是HTML和单选按钮:

 <div data-role="popup" id="popupShapes" data-theme="none" style="z-index:999" data-dismissible="true" data-close-btn="right">
        <a href="#" data-rel="back" data-role="button" data-theme="b" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
        <div data-role="collapsibleset" data-theme="b" data-content-theme="a" style="margin:0; width:250px;">
            <div data-role="listview" data-inset="false">
                <ul data-role="listview">
                    <li>
                        <input type="radio" name="type" value="point" id="pointToggle" />
                        <label for="pointToggle">Point</label>
                    </li>
                    <li>
                        <input type="radio" name="type" value="line" id="lineToggle" />
                        <label for="lineToggle">Line</label>
                    </li>
                    <li>
                        <input type="radio" name="type" value="polygon" id="polygonToggle" />
                        <label for="polygonToggle">Polygon</label>
                    </li>
                </ul>
            </div><!-- /collapsible -->
        </div><!-- /collapsible set -->
    </div><!-- /popup -->

在某些时候,我需要删除所选的输入单选按钮。

我是怎么做到的:

  $('#popupShapes ul input').prop('checked', false);

但上面的一行并不奏效。单选按钮保持选中状态。

如何从单选按钮中删除选择?

1 个答案:

答案 0 :(得分:0)

这个简单的脚本允许您取消选中已经选中的单选按钮。适用于所有支持JavaScript的浏览器。

<html>
    <!-- html from your link: [http://jsfiddle.net/wuAWn/][1]  -->
    <body>
        <input type='radio' class='radio-button' name='re'>
        <input type='radio' class='radio-button' name='re'>
        <input type='radio' class='radio-button' name='re'>
    </body>

    <script type="text/javascript">
        var allRadios = document.getElementsByName('re');
        var booRadio;
        var x = 0;
        for(x = 0; x < allRadios.length; x++){

            allRadios[x].onclick = function() {
                if(booRadio == this){
                    this.checked = false;
                    booRadio = null;
                }else{
                    booRadio = this;
                }
            };
        }
    </script>
</html>

JSFIDDLE