如何显示文本框的单选按钮的点击是使用javascript检查

How to display a textbox onclick of a radiobutton which is checked using javascript?

本文关键字:检查 javascript 单选按钮 显示 文本 何显示      更新时间:2023-09-26

我有一个HTML如下:

<div class="col-lg-2 camt hidden">
    <label for="camt">CEAV Amount:</label>
</div>
<div class="col-lg-4 camt hidden radio">
    <label>
        <input type="radio" value="..xyz.." name="camt" id="camt1" required onclick="functions()" />XYZ</label>
    <hr/>
    <div class="row">
        <div class="col-lg-4">
            <label>
                <input type="radio" value="ABC" name="camt" id="camt2" required onclick="functions()" />ABC</label>
        </div>
        <div class="col-lg-8">
            <input type="number" class="form-control hidden popup1" onchange="functions()" id="textpart" placeholder="Enter value. Only numbers." required />
        </div>
    </div>
    <hr/>
    <label>
        <input type="radio" value="NA" name="camt" required id="camt3" onclick="functions()" />NA</label>
    <hr/>
</div>

我在javascript中有一个函数editData(),它设置屏幕上所有输入的值。它还在加载form时检查radio button。所以,如果单选按钮camt2被选中,我想在它前面显示一个textbox。但这并没有奏效。我想检查radio button是否被检查的两个函数editData()funcitons(),它们将textbox设置为隐藏或可见。它们都在下面: editData ()

function editData() {
    var logfromform = document.getElementById('logref').value;
    var key;
    for (key in Log1) {
        if (Log1[key].LogReference == logfromform) {
            if (Log1[key].RedemptionPrice == '100%') {
                document.getElementById('redprice1').checked = true;
                functions();
            } else if (Log1[key].RedemptionPrice == 'NA') {
                document.getElementById('redprice3').checked = true;
                functions();
            } else {
                document.getElementById('redprice2').checked = true;
                functions();
            }
        }
    }
}

函数()

function functions() {
    if (document.getElementById('camt2').checked) {
        $("#textpart").removeClass("hidden");
    } else {
        $("#textpart").addClass("hidden");
    }
}

当我运行HTML form时,正在输入JavaScript,但removeclass不能在textbox上工作任何帮助非常感激!请注意,我正在运行Internet Explorer 11.0.9600NO,我没有替代浏览器来进行我的工作。

试试这个:

JQuery:

function functions(){       
    if($("#camt2").is(":checked")){
        $("#textpart").removeClass("hidden");
    } else {
        $("#textpart").addClass("hidden");
    }
}

我想你的父div被隐藏了。因此,您还需要使col-lg-4div也可见。试试这个:

function functions(){       
if(document.getElementById('camt2').checked)
    {
        $(".col-lg-4").removeClass("hidden");
        $("#textpart").removeClass("hidden");
    }
    else{
    $("#textpart").addClass("hidden");
    }
}

嗨,我想建议,如果你已经使用jquery,那么为什么我们需要制作类和操纵…?

你可以使用.show().hide()

function functions(){       
    if($("#cam2").is(":checked")){
        $("#textpart").show();
    } else {
        $("#textpart").hide();
    }
}

我复制你的html和js代码,它是为我工作。我不得不删除div.col-lg-4.radio上的隐藏类来显示元素。但是功能functions对我来说工作得很好。在控制台显示任何js错误吗?