jquery 如何从以前选中的属性中删除单选按钮？

shstlldc 于 2023-03-17 发布在 jQuery

关注(0)|答案(5)|浏览(123)

我有一些单选按钮，我正在添加选中属性到选定的单选按钮，但有一个问题。我想删除选中的单选按钮的“选中”属性。
HTML代码：

<div class="tabtwo-info">
    <div class="tab-two">
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Unsecured Loans
                    </div>
                </div>
            </a>

        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Secured 2nd Charge Lending
                    </div>
                </div>
            </a> 
        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Overdrafts
                    </div>
                </div>
             </a> 
        </div>
        <div class="seperator">
            <div class="container">
                <div class="row">   <span class="sep"></span>   
                </div>
            </div>
        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Trade Finance
                    </div>
                </div>
            </a>

        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Business Cash Advance
                    </div>
                </div>
            </a>

        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Working Capital
                    </div>
                </div>
            </a> 
        </div>
        <div class="seperator">
            <div class="container">
                <div class="row">   <span class="sep"></span>   
                </div>
            </div>
        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Stock Finance
                    </div>
                </div>
            </a>

        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 ">   <a class="brokersector" href="javascript:void(0);">
                <input type="radio" value="" id="" name="brokersector">
                <div class="image-cat-box">
                    <div class="image-box">
                    </div>
                    <div class="title-cat">
                        Acquisition Finance
                    </div>
                </div>
            </a>

        </div>
        <div class="seperator">
            <div class="container">
                <div class="row">   <span class="sep"></span>   
                </div>
            </div>
        </div>
    </div>
</div>

jQuery代码：

$(".tabtwo-info .brokersector").click(function () {
    $(this).find('input:radio').attr('checked', true);
});

我的JSFiddle：https://jsfiddle.net/jj57q8fs/
JSFiddle截图：

jquery

来源：https://stackoverflow.com/questions/30052447/how-to-remove-radio-button-checked-attribute-from-previously-selected

5条答案

按热度按时间

zvms9eto1#

要强制删除属性，请在选中新的之前：

$(".brokersector").click(function () {
    $('input[type=radio]').removeAttr('checked');
    $(this).find('input[type=radio]').attr('checked', 'checked');
});

这将强制删除所有单选按钮上的checked，然后再设置一个新的单选按钮。当然，选择器可以更具体，就像Idir的例子。
另外，使用prop代替@Regent posted a fiddle。我建议您使用此命令，如文档中所述：
然而，关于checked属性，需要记住的最重要的概念是它不对应于checked属性。该属性实际上对应于defaultChecked属性，并且应该仅用于设置复选框的初始值。checked属性值不随复选框的状态而改变，而checked属性值随复选框的状态而改变。

赞(0）回复(0）举报 2023-03-17

o75abkj42#

试试这个，

$(".tabtwo-info .brokersector").click(function() {
  $('input[name=brokersector]').removeAttr('checked');
  $(this).find('input:radio').attr('checked', 'checked');
});

赞(0）回复(0）举报 2023-03-17

wvmv3b1j3#

我同意[Rory McCrossan][1]的观点，你不需要jQuery来做这件事。但是你可以这样做：

$('input[name=brokersector]:checked').removeAttr('checked');

赞(0）回复(0）举报 2023-03-17

mklgxw1f4#

Try this, works.

   

    <!DOCTYPE html>
<html>
<body>
<form onClick="if(event.target.tagName=='INPUT'){if(event.target==document.querySelectorAll('INPUT')[0]){event.target.parentNode.innerHTML=tp;};if(event.target==document.querySelectorAll('INPUT')[1]){event.target.parentNode.innerHTML=tp2;};if(event.target==document.querySelectorAll('INPUT')[2]){event.target.parentNode.innerHTML=tp3;};}">
<input  type='radio' />C<input  type='radio' />JS<input  type='radio' />About
</form>
<button onClick="em.querySelectorAll('INPUT')[0].removeAttr('checked');em.querySelectorAll('INPUT')[1].removeAttr('checked');">aaa</button>
<script>
tp="<input  type='radio' checked/>C<input  type='radio' />JS<input  type='radio'/>About"; 
tp2="<input  type='radio' />C<input  type='radio' checked/>JS<input  type='radio'/>About"; 
tp3="<input  type='radio' />C<input  type='radio' />JS<input  type='radio' checked/>About"; 

</script>

</body>
</html>

赞(0）回复(0）举报 2023-03-17

1qczuiv05#

$(".tabtwo-info .brokersector").click(function () {
$("input:radio").removeAttr("checked");
    $(this).find('input:radio').attr('checked', true);
});

});

赞(0）回复(0）举报 2023-03-17

我来回答

jquery 如何从以前选中的属性中删除单选按钮？

5条答案

相关问题

热门标签

最新问答