Javascript 如果单击LI，应检查LI内的输入收音机

我有多个LI，在这个LI中，我作为收音机输入， 点击li，它将在右侧显示不同的数据，数据显示正确，但问题是—— 我想要的是，如果我点击了Li，我想将checked属性添加到该Li中的输入中。 如果我单击了另一个LI，则选中的属性将从先前的单选框中删除，并将其添加到单击的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").click(function(){
    $(".list-unstyled > li").find('input[type="radio"]').removeAttr('checked');
    $(this).find('input[type="radio"]').attr('checked','checked');
});

请修复您的html，删除相同id、嵌套和标记结尾的多个用法。

尝试此代码

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

---

多个元素具有相同的id…我认为这是不正确的方式…给定元素只能有一个元素…请改用class属性。元素id在整个文档中应该是唯一的，重复的id是无效的标记。如果你想对你的lis做类似的事情，使用一个类。

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