Javascript 多个文本字段，基于单选显示/隐藏（Html、JS）

我现在正在处理一个

表单

，有以下问题

问题

我在同一页上有多个问题，答案完全相同（是/否/可能），其中一个是“可能”。用户选中名为“可能”的

单选按钮

或

复选框后，应出现
文本字段
。我已经实现了一个javascript，但它似乎不起作用。当有多个文本字段和单选按钮时，我真的不知道如何编程

我对HTML/Jquery/Javascript/CSS相当陌生

如何做到这一点？我知道有人问过类似的问题，但我在这一点上真的不知道

非常感谢您的支持

[编辑]我尝试过使用相同的id，但似乎不起作用

下面是对代码的修改：

这是表单的匿名摘录（我不是故意这样做的，这样你可以有一个更好的概述）：

Javascript：

$(document).ready(function(){
$("#maybe_on").hide();
$("input:radio[name*='Teil']").change(function(){//*=   to search for a substring
                                                //='Teil' because the name of the buttons begin with Teil
                                                //for example Teil01_Frage01
        if(this.value == 'maybe' && this.checked){
          $("#maybe_on").show();
        }else{
          $("#maybe_on").hide();
        }
}); });

如评论中所述，ID必须是唯一的，并且您的单选按钮可能共享相同的ID。除此之外，您可以使用以下jQuery：

$(document).ready(function () {
    $(".maybe_on").hide();
    $("input:radio[name^='Teil01_']").change(function () {
        $(this).closest('.ui-grid-b.ui-responsive').find('.maybe_on').toggle((this.value == 'maybe' && this.checked));
    });
});

如评论中所述，ID必须是唯一的，并且您的单选按钮可能共享相同的ID。除此之外，您可以使用以下jQuery：

$(document).ready(function () {
    $(".maybe_on").hide();
    $("input:radio[name^='Teil01_']").change(function () {
        $(this).closest('.ui-grid-b.ui-responsive').find('.maybe_on').toggle((this.value == 'maybe' && this.checked));
    });
});

创建了一个inpage Javascript函数，用于检查是否单击了有问题的输入字段。如果是，则显示“可能”输入

function yesnoCheck() {
if (document.getElementById('tUmfrage01_p01_f01_q01_radio03').checked) {
    document.getElementById('maybe_on').style.display = 'block';
}
else document.getElementById('maybe_on').style.display = 'none';

}

编辑
创建了一个inpage Javascript函数，用于检查是否单击了有问题的输入字段。如果是，则显示“可能”输入

function yesnoCheck() {
if (document.getElementById('tUmfrage01_p01_f01_q01_radio03').checked) {
    document.getElementById('maybe_on').style.display = 'block';
}
else document.getElementById('maybe_on').style.display = 'none';

}

编辑
id应该是唯一的，您在所有的标签上都使用了“maybe\u on”，也
$（“输入：radio[name=“Teil01\u Frage01”）
对其中一个双引号使用单引号EID应该是唯一的，您在所有标签上都使用了“maybe\u on”，也
$（“输入：radio[name=“Teil01\u Frage01”）
对双引号中的一个使用单引号。当你点击第二个和第三个问题时会发生什么？我没有对这些问题进行编码，我只是更新了JS并编辑了我的答案，以包含它们@J08691这类作品，但如果你选择“可能”，然后将答案更改为“是”或“否”，则“可能”保持打开状态。当你点击“可能”时会发生什么关于第二个和第三个问题？我没有编写这些代码，我只是更新了JS并编辑了我的答案以包含它们@J08691这类作品，但是如果您选择“可能”，然后将答案更改为“是”或“否”，那么“可能”将保持打开状态。非常感谢您的努力和时间：）问题已解决。最后一个问题…我还有一个复选框“可能”，但遗憾的是，它不起作用。另一方面，所有单选按钮“可能”都与上述代码完美配合。您对如何实现这一点有什么建议吗？谢谢。不过，我刚刚添加了另一个Java代码，将“收音机”替换为“复选框”“而且似乎工作得很好。非常感谢您的帮助！非常感谢您的努力和时间：）问题解决了。最后一个问题…我还有一个复选框“可能”，但遗憾的是它不起作用。另一方面，所有单选按钮都是“可能”完美地使用上面的代码。你对如何实现这一点有什么建议吗？谢谢。没关系，我刚刚添加了另一个Java代码，我用“checkbox”替换了“radio”，似乎工作得很好。非常感谢你的帮助！