选中后为单选按钮的值添加边框（jquery/JS）

Question

在选中“是的广播”按钮时，我想在“是”值中添加一个边框（不是概述）。我可以onchange在输入单选按钮上放置一个事件，但我无法为“是”值添加边框，因为没有标签。我如何使用 jquery/javascript 做到这一点？

我试过了

$("input:radio[name='registered'][value='yes']").css("border","3px solid red");

但这甚至没有给复选框一个边框（只有当我更改为大纲时才有效），更不用说复选框的值了。有什么想法吗？理想情况下，HTML 文件将保持不变，所有更改都在 js 文件中进行。我看到的示例大多添加了 label 标签或 div，但这没有任何标签供我使用。我试过 .value.css() 但它无效。

<form name="input" method="get">

        <span>Registered:</span>

        <input type="radio" name="registered" value="yes">YES  

        <input type="radio" name="registered" value="no" checked disabled>NO

</form>

Answer 1

您在YES或NO文本中使用任何元素$(document).ready(function() {&nbsp; &nbsp; $("input[type=radio]").click(function(e) {&nbsp; &nbsp; &nbsp; &nbsp;$(this).next("span").css("border","2px solid red");&nbsp; &nbsp; });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><form name="input" method="get">&nbsp; &nbsp;<span>Registered:</span>&nbsp; &nbsp;<input type="radio" name="registered" value="yes">&nbsp; &nbsp;<span>YES</span>&nbsp;&nbsp; &nbsp;<input type="radio" name="registered" value="no" checked disabled>&nbsp; &nbsp;<span>NO</span></form>

Answer 2

不需要javascript。您可以使用:checked选择器。你也应该用 span 包裹你的文本。input[type="radio"]:checked:not(:disabled) + span{&nbsp; border: 2px solid red;}<form name="input" method="get">&nbsp; <span>Registered:</span>&nbsp; <input type="radio" name="registered" value="yes"><span>YES</span>&nbsp; <input type="radio" name="registered" value="no" checked disabled><span>NO</span></form>