Question

我正在尝试在提交表单后获取复选框的值，但是没有输出任何内容。网站上没有有关该操作方法的文档。

$(document).ready(function(){
    $('.ui.radio.checkbox').checkbox();

    $('#formOne').submit(e => {
       let num = $('#radio').val();
       console.log(num);
       e.preventDefault();
    });
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.js"></script>

<form class="ui form" id="formOne">
    <div class="field" id="radio" >
        <div class="ui radio checkbox">
            <input type="radio" value="one" name="number">
            <label>One</label>
        </div>
        <div class="ui radio checkbox">
            <input type="radio" value="two" name="number">
            <label>Two</label>
        </div>
    </div>
    <button class="ui button" type="submit">Submit</button>
</form>

Answer 1

您需要找到选定的电台，而不是电台周围的div。

$(document).ready(function(){
  $('.ui.radio.checkbox').checkbox();

$('#formOne').submit(e => {
      let num = $('#radio').find('[name="number"]:checked').val();
      console.log(num);
      e.preventDefault();
  });
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.js"></script>

<form class="ui form" id="formOne">
  <div class="field" id="radio" >
    <div class="ui radio checkbox">
      <input type="radio" value="one" name="number">
      <label>One</label>
    </div>
    <div class="ui radio checkbox">
      <input type="radio" value="two" name="number">
      <label>Two</label>
    </div>
  </div>
  <button class="ui button" type="submit">Submit</button>
</form>

Answer 2

我相信您正在寻找类似的东西。

<script>
$(document).ready(function(){
  $('.ui.radio.checkbox').checkbox();

$('#formOne').submit(e => {
      var num = $("input[name='number']:checked").val();
      console.log(num);

      e.preventDefault();
  });
});
</script>

您的HTML是：

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.js"></script>

    <form class="ui form" id="formOne">
      <div class="field" id="radio" >
        <div class="ui radio checkbox">
          <input type="radio" value="one" name="number">
          <label>One</label>
        </div>
        <div class="ui radio checkbox">
          <input type="radio" value="two" name="number">
          <label>Two</label>
        </div>
      </div>
      <button class="ui button" type="submit">Submit</button>
    </form>

Answer 3

像这样使用：

800.000

Live demo

获取在语义ui中检查的无线电的价值

3 个答案: