从动态下拉列表中获取价值 [英] get value from dynamic dropdown jquery

问题描述

我正在尝试从一个Jquery通过Ajax动态创建的保管箱中获取Option值，具体取决于对另一个保管箱的选择，但是到目前为止没有成功.

I am trying to get the Option value from a dropbox created dynamically throught Ajax with Jquery, depending of the selection of another dropbox, but till now no success.

我的结构是这样的:

HTML投寄箱1:

<select id="slt1">
 <option value="" selected>Select</option>
 <?php foreach($prozess as $p): ?>
 <option value="<?php echo $p->Id; ?>"><?php echo $p->Name; ?></option>
 <?php endforeach; ?>
</select>

投递箱2:

<select id="slt2"></select>

与选择保管箱1相关的是保管箱2的结果

In relation with the selection of dropbox 1 will be the result of dropbox 2

Ajax Jquery看起来像这样:

Ajax Jquery Looks like this:

$.ajax({
      data: { id_prozess : $(#slt1).val() },
      url:   'page.php',
      type:  'POST',
      dataType: 'json',
      success:  function (r) {
                $(#slt1).prop('disabled', false);
                $(#slt2).find('option').remove();
                $(r).each(function(i, v){ // indice, valor
                $(#slt2).append('<option value="' + v.id + '">' + v.Name + '</option>');

                 })

                 },
      error: function(){
                        alert('Ocurrio un error en el servidor ..');
                    }
                });

当我尝试在保管箱2中获取所选项目的值时，我开始感到头疼.我就是这样尝试的:

In the Moment when I try to get the values of a selected item in dropbox 2 start my headache. Like this is how I tried:

 $(#slt2).on( "change", function() {
    alert( $("#slt2").val() );
});

但到目前为止，答案相同:未定义

But till now the same answer: UNDEFINED

有人可以帮我头痛吗?

推荐答案

正如其他答案所指出的那样，您的jQuery选择中有一个错字 $(#slt2)，因为它们不是包裹在''或" 中，这可能会给您带来麻烦.

As other answers have pointed out, you have a typo in your jQuery selection, $(#slt2) since they aren't wrapped in '' or "", which might cause you trouble.

您也没有告诉我们在哪里运行代码来绑定 change 事件，这也可能很有趣.

Neither are you telling us where you run the code to bind the change event, which also might be of interest.

如果在创建下拉列表之前运行它，则引用的元素目前尚不存在.您可以通过绑定到代码运行时存在的对象来绑定事件，但可以将其链接到所需的对象.请参见下面的小提琴，该小提琴将在3秒后创建并添加一个下拉菜单，并带有之前运行的绑定.

In the case you are running it before the dropdown has been created, you are referencing an element that at the moment not yet exists. You can bind events to it by binding to an object that exists at the time the code runs, but link it to the desired object. See fiddle below that will create and append a dropdown after 3 seconds, and with a binding that is run before.

$('body').on('change', '#slt2', myFunction);

setTimeout(function() {

  var optionList = ["Volvo", "Saab", "BMW"];
  var dropdown = $("<select></select>").attr("id", "slt2");

  $.each(optionList, function(i, el) {
    dropdown.append("<option>" + el + "</option>");
  });

  $("#dropdown-container").append(dropdown);


}, 3000);

function myFunction() {
  alert($(this).val());
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="dropdown-container">
</div>

这篇关于从动态下拉列表中获取价值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！