如何在下面的代码中使用 jquery 获取由单选按钮触发的文本框的值

How to get the value of Text box that is triggered by the radio button using jquery in the following code

本文关键字：单选按钮 文本 获取 jquery 在下面 代码      更新时间：2023-09-26

在我的测试用例中，用户有两个选项，即雅思或托福。 如果用户选择雅思，则会打开一个输入框，他输入他的雅思成绩。 我正在寻找的是捕获在输入框中输入的值。 下面是我的代码：

<div id='show-me' style='display:none' class="ds">
    <label for="number" id="uel">IELTS:</label>
    <input type="text" class="form-control" placeholder="Example:6.5" id="ranju" name="toefl" reuqired/>
</div>
<div id='touch-me' style='display:none'>
    <label for="number" id="uel">TOFEL:</label>
    <input type="text" class="form-control" name="fle" placeholder="Example:90" id="ranju" required/>
</div>
<script>
$('input[type=submit]').click(function () {
    if (($('input[name=cgpa]').val() != '') && $('input[name=gre]').val() != '')) {
    jQuery.noConflict();
    $("#myModel").modal('show');
    console.log($("input[name=test]:checked").val());
    } else {
        alert("Enter details");
    }
});
</script>

以下是它应该如何工作：

  • 步骤 1：用户单击其中一个单选按钮
  • 步骤 2：文本框与单选按钮打开相关
  • 步骤 3：用户输入值
  • 步骤4：控制台.log（-----）应打印捕获的值

重新创建你的 html 代码：

<input type="radio" name="type" value="ielts"/> IELTS &nbsp; <input type="radio" name="type" value="tofel"/> TOFEL
<div id='show-ielts' style='display:none'>
    <label for ="number" id="uel">IELTS:</label>
    <input type="text" class="form-control" placeholder="Example:6.5"  name="ielts" reuqired/>
</div>
<div id ='show-tofel' style='display:none'>
    <label for ="number" id="uel">TOFEL:</label>
    <input type="text" class="form-control" name="tofel"  placeholder="Example:90" required/>
</div>
<br/>
<input type="submit" value="submit"/>

然后是javascript代码：

$(document).ready(function() {
        // listen the radio button changed event and display the target field.
        $('input[name="type"]').change(function() {
            $('#show-ielts, #show-tofel').hide();
            $('#show-' + $(this).val()).show();
        });
        // when submit
        $('input[type="submit"]').click(function() {
            var target_field = $('input[type="radio"]:checked').val();
            // console your target field value
            console.log(target_field + ' value is: ' + $('input[name="' + target_field + '"]').val());
        });
    });
相关文章：