单击单击“无线电”按钮需要启用浏览选项



我有2个无线电按钮和禁用的浏览按钮,我只想在选中单选按钮时启用浏览按钮。

这是我在做的。

请在下面找到HTML,让我知道我要在哪里出错,或者我可以提出代码。

<!DOCTYPE html>
<html>
  <head>
    <title>Page Title</title>
    <script>
      < script type = "text/javascript" >
        $("input.[name=radio2]").change(function() {
        $('input.[name=upload]').prop("disabled", false);
      });
    </script>
  </head>
  <body>
    <form>
      <p>
      <h5><label><b>Choose option:</b></label></h5>
      <label class="radio radio--alt">
        <input type="radio" name="radio2">
        <span class="radio__input"></span>
        <span class="radio__label">XYZ</span>
      </label>
      <label class="radio radio--alt">
        <input type="radio" name="radio2">
        <span class="radio__input"></span>
        <span class="radio__label">ABC</span>
      </label>
      <br><b>
      <h4>Upload File: &nbsp <input type="file" id="uploadFile"                         name="upload" disabled="disabled"> </h4>
      </p>
    </form>
  </body>
</html>

您使用的是属性选择器来选择正确的元素,但您在其上有额外的 .

尝试这个

 $("input[name='radio2']").change(function () {
        $('input[name="upload"]').prop("disabled", false); 
    }); 

或最简单的(类和ID选择器)

$(".radio-someclass").change(function () {
        $('#uploadFile').prop("disabled", false); 
}); 

为此,请确保将radio-someclass添加到两个无线电元素中。

更新

好的,等等。因此,您还没有使用jQuery,您还有额外的<script>,然后将脚本放入Document..ready。该死!!!很多事情让我粘贴整个过程。请正确浏览它,看看您错过了什么。:)

    <!DOCTYPE html>
    <html>
     <head>
       <title>Page Title</title>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
     </script>
     <script>
      $(function(){
        $("input[name='radio2']").change(function() {
        $('input[name="upload"]').prop("disabled", false);
       });
      })
      </script>
      </head>
    <body>
    <form>
      <p>
      <h5><label><b>Choose option:</b></label></h5>
      <label class="radio radio--alt">
        <input type="radio" name="radio2">
        <span class="radio__input"></span>
        <span class="radio__label">XYZ</span>
      </label>
      <label class="radio radio--alt">
        <input type="radio" name="radio2">
        <span class="radio__input"></span>
        <span class="radio__label">ABC</span>
      </label>
      <br><b>
      <h4>Upload File: &nbsp <input type="file" id="uploadFile"                         name="upload" disabled="disabled"> </h4>
      </p>
    </form>
  </body>
</html>

最新更新