Potrzebuję Pokaż ID wyboru przez JS, według tego kodu Pokaż tylko 1 i najpierw wybierz ID

Mój kod jest tym HTML i JavaScript

<tr>
<td>
  <select name="jens_id[]" id="jens_id" required="" >
    <option ></option>
    <option >1</option>
    <option >2</option>
  </select>
</td>
</tr>
<tr>
<td>
  <select name="jens_id[]" id="jens_id" required="" >
    <option ></option>
    <option >1</option>
    <option >2</option>
  </select>
</td>
</tr>
<script>
$(document).ready(function(){
    $('#jens_id').change(function(){
        statteId = $("#jens_id").val()
        alert(statteId);
    });
}); 
</script>

Może pomóc w skrypcie edycji

0
user3440555 28 czerwiec 2017, 12:32

4 odpowiedzi

Najlepsza odpowiedź

Atrybut id powinien być unikalny w innym przypadku tylko pierwszy zostanie wybrany (przy użyciu selektora ID), dla grupy elementów użyj wspólnej klasy zamiast tego w obrębie znakomitej obsługi zdarzeń Zastosowanie this, aby odnosić się Kliknięty element.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <select name="jens_id[]" class="jens_id" required="">
    <option ></option>
    <option >1</option>
    <option >2</option>
  </select>
    </td>
    <td></td>
  </tr>
  <tr>
    <td>
      <select name="jens_id[]" class="jens_id" required="">
    <option ></option>
    <option >1</option>
    <option >2</option>
  </select>
    </td>
    <td></td>
  </tr>
</table>
<script>
  $(document).ready(function() {
    // or use attribute equals selector
    // $('[name="jens_id[]"]')
    $('.jens_id').change(function() {
      statteId = $(this).val(); // or this.value
      console.log(statteId);
      // get the td and update with value
      $(this).parent().next().text(statteId);
    });
  });
</script>
0
Pranav C Balan 28 czerwiec 2017, 16:07

Jesteś już świadomy, że identyfikator elementu na stronie powinien być wyjątkowy.

Gdy masz wiele elementów o tym samym identyfikatorze, a następnie {x0}} selektor zwraca pierwszy dopasowany element. Jak wspomniano w innych odpowiedziach , powinieneś używać klasy , jeśli to możliwe.

Z jakiegokolwiek powodu, jeśli nie możesz użyć klasy i chcesz znaleźć z ID, możesz użyć go jak $('select#jens_id') lub $('[id="jens_id"]') i otrzymać wybraną opcję Użyj kontekstu do this, która będzie Znajdź wybraną opcję do zmiany elementu Wybierz.

$(document).ready(function() {
   $('select#jens_id').change(function() {
      alert($(this).find('option:selected').text());
   });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="jens_id[]" id="jens_id" required="">
    <option ></option>
    <option >1</option>
    <option >2</option>
  </select>

<select name="jens_id[]" id="jens_id" required="">
    <option ></option>
    <option >3</option>
    <option >4</option>
  </select>

Dodaj atrybut multiple, aby wybrać, czy należy wybrać wiele wartości.

0
Prashant Shirke 28 czerwiec 2017, 09:53
$(document).ready(function() {
  $('.jens_id').change(function() {
    statteId = $('option:selected', this).text()
    alert(statteId);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="jens_id[]" class="jens_id" required="">
    <option ></option>
    <option >1</option>
    <option >2</option>
  </select>

<select name="jens_id[]" class="jens_id" required="">
    <option ></option>
    <option >3</option>
    <option >4</option>
  </select>
  1. Identyfikator powinien być unikalny, używać klasy i użyć tego kontekstu, aby powiedzieć bieżącą zmianę
0
guradio 28 czerwiec 2017, 09:36

Spróbuj z each() funkcja jQuery. I zmień selektor za pomocą Tagname lub ClassName zamiast id .id jest unikalny dla pełnego dokumentu

$(document).ready(function() {
  $('select').each(function(){
   console.log($(this).val())
  })
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
  <td>
    <select name="jens_id[]" id="jens_id" required="">
    <option ></option>
    <option selected>1</option>
    <option >2</option>
  </select>
  </td>
</tr>
<tr>
  <td>
    <select name="jens_id[]" id="jens_id" required="">
    <option ></option>
    <option >1</option>
    <option selected>2</option>
  </select>
  </td>
</tr>
0
prasanth 28 czerwiec 2017, 09:35