Question

我有多个LI，而且我正在输入收音机，点击li后，它会在右侧显示不同的数据，数据只显示正确的问题 - 我想要的是，如果我点击了李，我想添加＆＃34;检查＆＃34;在李里面输入的属性。如果我点击了另一个LI，那么＆＃34;检查＆＃34;属性将从之前的单选框中删除，并将其添加到单击的Li内的相应单选框中

我的HTML代码示例：

<ul class="list-unstyled">
 <li id="allRoles" onclick="" class="user-roles">
<ul class="list-unstyled">
 <li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
<li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
<li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
<li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
</ul>   <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
<li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
<li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
<li id="allRoles" onclick="" class="user-roles">
    <div class="grpRow">
        <span class="radio-placeholder">
            <input type="radio" name="userRole" value="6" id="6" style="display:none"></span>
            <span>Admin</span><br>
    </div>
</li>
</ul>

以下是我的剧本：

$(".list-unstyled li").each(function(){
            if($(this).hasClass("active")){
                $(".active .radio-placeholder input").attr("checked","CHECKED");
            }
            else{
                $(".active .radio-placeholder input").each(function(){
                    if(!$(this).parents("li").hasClass('active')){
                      $(this).removeAttr("checked","CHECKED");
                    }
                });
            }

        });

请尽快指导我。

Answer 1

试试这个：

$(".list-unstyled > li").click(function(){
    $(".list-unstyled > li").find('input[type="radio"]').removeAttr('checked');
    $(this).find('input[type="radio"]').attr('checked','checked');
});

请修复您的html，删除相同ID，嵌套和标记结尾的多次使用。

Answer 2

试试此代码

 $(".active .radio-placeholder input").prop('checked', true);

如果单击LI，则应检查li内的输入无线电

2 个答案: