Тази публикация първоначално е публикувана в techsolutionstuff.com — 2 минути четене

В тази статия ще видим как да получите множество стойности на полето за отметка в jquery. Тук ще се научим да получаваме избраните стойности на квадратчето с помощта на jquery. Ще използваме селектора :checked за квадратчета за отметка и радио бутони. Може да извлече избраната стойност на квадратчето за отметка.

Когато щракнете върху квадратчето за отметка, ще избутаме стойността в масива с помощта на функцията push().

И така, нека да видим получаване на избрани стойности на квадратчета за отметка в jquery, множество стойности на квадратчета за отметка в javascript и как да получите множество стойности на квадратчета за отметка в jquery с помощта на масив.

Пример:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>How To Get Multiple Checkbox Value In jQuery</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
</head>
<body>
    <form>
        <h3>Select languages:</h3>
        <label><input type="checkbox" value="laravel" name="language"> Laravel </label>        
        <label><input type="checkbox" value="php" name="language"> PHP </label>        
        <label><input type="checkbox" value="jquery" name="language"> jQuery </label>
        <label><input type="checkbox" value="javascript" name="language"> JavaScript </label>
        <label><input type="checkbox" value="react" name="language"> React </label>
        <label><input type="checkbox" value="angular" name="language"> Angular </label>
        <label><input type="checkbox" value="python" name="language"> Python </label>
        <br>
        <button type="button">Get Selected Values</button>
    </form>
  <script>
      $(document).ready(function() {
          $("button").click(function(){
              var arr = [];
              $.each($("input[name='language']:checked"), function(){
                  arr.push($(this).val());
              });
              alert("Your selected languages are: " + arr.join(", "));
          });
      });
  </script>
</body>
</html>

Изход:

Може да ви хареса също:

Ако тази публикация е била полезна, моля, щракнете върху бутона за пляскане 👏 по-долу.