选择时添加班级并在单选按钮上更改文本 [英] Add class and change text on radio button when selected

问题描述

我正在尝试选择单选按钮上的文本.我有它的工作，所以如果选中了单选按钮，我将一个类添加到父级，现在只需要更改父级内跨度文本的部分即可(如果希望将"Select"文本更改为"Selected"，单选按钮已选中).这是我的代码:

I am trying to change the text on a radio button once it's been selected. I have it working so I add a class to the parent if the radio button is checked, now just need the part to change the text of the span inside the parent (I want the text "Select" to change to "Selected" if the radio button is checked). Here's my code:

$(document).ready(function(){
    //add the Selected class to the checked radio button
    $('input:checked').parent().addClass("selected");
    //If another radio button is clicked, add the select class, and remove it from the previously selected radio
    $('input').click(function () {
        $('input:not(:checked)').parent().removeClass("selected");
        $('input:checked').parent().addClass("selected");
    });

});
            <td><div class="selectBtn">
                <input type="radio" name="group1" id="one" value="Falcon Air Trust">
                <span class="selectTxt">Select</span></div></td>
            <td><div class="selectBtn">
                <input type="radio" name="group1" value="Atlantic Aviation">
                <span class="selectTxt">Select</span></div></td>
            <td><div class="selectBtn">
                <input type="radio" name="group1" value="Reliance Aviation">
                Select</div></td>

推荐答案

尝试一下

$(document).ready(function(){
    //add the Selected class to the checked radio button
    $('input:checked').parent().addClass("selected");
    //If another radio button is clicked, add the select class, and remove it from the previously selected radio
    $('input').click(function () {
        $('input:not(:checked)').parent().removeClass("selected").find("span").html("Select");
        $('input:checked').parent().addClass("selected").find("span").html("Selected");
    });

});

这篇关于选择时添加班级并在单选按钮上更改文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！