JavaScript-复选框启用/禁用无线电按钮

发布于 2025-02-10 05:41:01 字数 1667 浏览 2 评论 0原文

我好近！默认情况下，启用了按钮。同样，在检查两者时，都将启用两者，但是如果未选中，则仅禁用一个。

我想要它，以便在检查复选框时启用两个无线电按钮。当未选中的情况下，两个无线电按钮都被禁用。

没有jQuery，请

js：

var sipch = document.querySelector("input[name=sip]");
sipch.addEventListener("change", function (event) {
    if (event.currentTarget.checked) {
        document.querySelector("input[name=protocol]").removeAttribute("disabled");
    } else {
        document.querySelector("input[name=protocol]").setAttribute("disabled", "disabled");
    }
});

html：

<!DOCTYPE html>
<html lang="en">
    <body>
        <form id="myForm" onsubmit="goPVFive(event)" method="get">
            <div id="pBFContainer" class="container">
                <div id="bodyFOption1">
                    <input type="checkbox" name="sip" value="true">Would you like to include establishing the SIP session test?<p>
                    <input type="radio" class="testD" name="protocol" value="udp" disable/>UDP
                    <input type="radio" class="testD" name="protocol" value="tcp" disable/>TCP <label class="testD">(UDP is most Common)</label>
                </div>
                <div id="bodyFOption2">
                    <input type="checkbox" name="fWallInt" value="true">Would you include SIP ALG firewall interference test"
                    </div>
            </div>
            <input type="submit" id="subButton" value="Next..." />
        </form>
    </body>
    <script type="text/javascript" src="evalportalp1.js"></script>
</html>

原文

IM SO CLOSE!
by default, the buttons are enabled. also when checked both are enabled but when unchecked only one is disabled.

I want it so that when the check box is checked both radio buttons are enabled. and when unchecked both radio buttons are disabled.

no Jquery, please

JS:

var sipch = document.querySelector("input[name=sip]");
sipch.addEventListener("change", function (event) {
    if (event.currentTarget.checked) {
        document.querySelector("input[name=protocol]").removeAttribute("disabled");
    } else {
        document.querySelector("input[name=protocol]").setAttribute("disabled", "disabled");
    }
});

HTML:

<!DOCTYPE html>
<html lang="en">
    <body>
        <form id="myForm" onsubmit="goPVFive(event)" method="get">
            <div id="pBFContainer" class="container">
                <div id="bodyFOption1">
                    <input type="checkbox" name="sip" value="true">Would you like to include establishing the SIP session test?<p>
                    <input type="radio" class="testD" name="protocol" value="udp" disable/>UDP
                    <input type="radio" class="testD" name="protocol" value="tcp" disable/>TCP <label class="testD">(UDP is most Common)</label>
                </div>
                <div id="bodyFOption2">
                    <input type="checkbox" name="fWallInt" value="true">Would you include SIP ALG firewall interference test"
                    </div>
            </div>
            <input type="submit" id="subButton" value="Next..." />
        </form>
    </body>
    <script type="text/javascript" src="evalportalp1.js"></script>
</html>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

ぇ气 2025-02-17 05:41:01

您需要使用QuerySelectorAll，然后循环通过结果，使每个结果都禁用/启用它们：

  if (event.currentTarget.checked) {
    document.querySelectorAll('input[name=protocol]')
        .forEach((elem) => elem.removeAttribute('disabled'));
  } else {
    document.querySelectorAll('input[name=protocol]')
        .forEach((elem) => elem.setAttribute('disabled', 'disabled'));
  }

Yo need to use querySelectorAll and then loop through the results, disabling/enabling each of them:

  if (event.currentTarget.checked) {
    document.querySelectorAll('input[name=protocol]')
        .forEach((elem) => elem.removeAttribute('disabled'));
  } else {
    document.querySelectorAll('input[name=protocol]')
        .forEach((elem) => elem.setAttribute('disabled', 'disabled'));
  }

回复收藏 0 原文

~没有更多了~