javascript - 如果单击单选按钮激活输入并获取值

Question

我有 3 个 radio 输入和 1 个文本输入。 “disabled”属性禁用文本输入。我想要做的是，当我单击第三个 radio 输入时，我的文本输入应该处于事件状态。当我单击另一个 radio 输入时，我的文本输入应该再次被禁用。接下来我想将值传递给 span 元素。因此，当我单击第一个 radio 时，我的跨度应该具有此值等。我不知道在启用它时如何从文本输入中获取值。

    $('#sause-oth').on('click', function(){
            $("#sause-other").prop("disabled", false);
    });
    $('.radio').on('click', function(){
        $("#sause-other").prop("disabled", true);
    });

    $('input[name="sause"]').on('change', function(){
        $('#summary_sause').html($(this).val());
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section>
    <label for="sause-light">Sos ladgodny</label> <br>
    <input type="radio" name="sause" id="sause-light" value="sos lagodny" class="radio"> <br>
    <label for="sause-hot">Sos ostry</label> <br>
    <input type="radio" name="sause" id="sause-hot" value="sos ostry" class="radio"> <br>
    <label for="sause-other">Sos inny</label> <br>
    <input type="radio" name="sause" id="sause-oth" class="enable">
    <input type="text" name="sause-other" id="sause-other" disabled="disabled">
</section>

<hr>

<p>Sos: <span id="summary_sause"></span></p>

Answer 1

要从文本中获取值，请将其放在范围内

$( "#sause-other" ).keyup(function() {
      var text = $(this).val();
      $( "#summary_sause" ).html( text );
});

您可以总结现有代码:

 $('input[name="sause"]').on('change', function() {
     var value = $(this).val();

     if (value == "on") {
       $("#sause-other").prop("disabled", false);
       $("#summary_sause").html("");
     } else {
       $("#sause-other").prop("disabled", true);
       $("#summary_sause").html(value);
     }
   });

链接: https://jsfiddle.net/832wnhpt/1/