Question

我不明白为什么它仍然没有通过表格，即使我选择了另一个复选框？根据{{1}}操作，如果else为空，则执行此操作

HTML：

 <form action="http://youtube.com" method="get">
  <ul>
    <li>
      <input id="checkbox_yoda" type="checkbox" name="character" value="light_side">
      <label for="checkbox_yoda" data-sentence="Force is strong in you">Yoda</label>
    </li>
    <li>
      <input id="checkbox_trooper" type="checkbox" name="character" value="dark_side">
      <label for="checkbox_trooper" data-sentence="Just chillin'">Trooper</label>
    </li>
    <li>
      <input id="checkbox_vader" type="checkbox" name="character" value="dark_side">
      <label for="checkbox_vader" data-sentence="There is no escape from the Dark Side.">Vader</label>
    </li>
  </ul>
  <button type="submit">Turn to the dark side</button>
</form>

JQUERY：

$("document").ready (
    function()
    {
        $("button").click(
            function()
            {
                if ($("input#checkbox_yoda :selected"))
                {
                    alert('you pick yoda');
                    return false;
                }

                else
                {
                    return true;
                }
            }
        )
    }
)

Answer 1

复选框具有:checked选择器，因此请使用is(':checked')确定复选框是已选中还是未选中。

$("document").ready (
  function()
  {
    $("button").click(
      function()
      {
        if ($("input#checkbox_yoda").is(':checked'))
        {
          alert('you pick yoda');
          return false;
        }

        else
        {
          return true;
        }
      }
    )
  }
)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="http://youtube.com" method="get">
  <ul>
    <li>
      <input id="checkbox_yoda" type="checkbox" name="character" value="light_side">
      <label for="checkbox_yoda" data-sentence="Force is strong in you">Yoda</label>
    </li>
    <li>
      <input id="checkbox_trooper" type="checkbox" name="character" value="dark_side">
      <label for="checkbox_trooper" data-sentence="Just chillin'">Trooper</label>
    </li>
    <li>
      <input id="checkbox_vader" type="checkbox" name="character" value="dark_side">
      <label for="checkbox_vader" data-sentence="There is no escape from the Dark Side.">Vader</label>
    </li>
  </ul>
  <button type="submit">Turn to the dark side</button>
</form>

Answer 2

由于你有多种选择，你可能想要做这样的事情：

$("document").ready(
  function() {
    $("button").click(
      function() {
        $("input[type=checkbox]").each(function() {
          if ($(this).is(':checked')) {
            alert('You picked ' + $(this).siblings('label').html() + '.');
          }
        })
      }
    )
  }
)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="http://youtube.com" method="get">(Try selecting more than one)
  <ul>
    <li>
      <input id="checkbox_yoda" type="checkbox" name="character" value="light_side">
      <label for="checkbox_yoda" data-sentence="Force is strong in you">Yoda</label>
    </li>
    <li>
      <input id="checkbox_yobiwan" type="checkbox" name="character" value="light_side">
      <label for="checkbox_obiwan" data-sentence="">Obiwan</label>
    </li>
    <li>
      <input id="checkbox_trooper" type="checkbox" name="character" value="dark_side">
      <label for="checkbox_trooper" data-sentence="Just chillin'">Trooper</label>
    </li>
    <li>
      <input id="checkbox_vader" type="checkbox" name="character" value="dark_side">
      <label for="checkbox_vader" data-sentence="There is no escape from the Dark Side.">Vader</label>
    </li>
    <li>
      <input id="checkbox_luke" type="checkbox" name="character" value="light_side">
      <label for="checkbox_luke" data-sentence="">Luke</label>
    </li>
  </ul>
  <button type="submit">Turn to the dark side</button>
</form>

希望它有所帮助。

if-else没有在javascript（jquery）工作

2 个答案: