无法 select select 下拉菜单中的值

Question

我使用 PHP 和 Jquery（以及 BootstrapCSS）来使用特定 folder/subfolder 中的文件填充两个下拉菜单。第一个下拉菜单显示特定路径中的文件：

/Code/(all the files here)

第二个下拉菜单通过 ajax 调用和 php 脚本填充。这是代码的一部分：最初我获取位于指定路径中的所有文件夹并将它们添加到下拉菜单中（这有效）：

<ul id="dropdown-menu-id_scn" class="dropdown-menu" role="menu">
    <?php                                                foreach(glob("Code/python/output/Scenarios/*") as $filename){
    // GET INDEX
    $pos = strpos($filename, 'Scenarios/');
    // GET SUBSTRING WITH SHAPE NAME
    $rest = substr($filename, $pos+10);
    echo "<li class='demolist_scn'><a href=>".$rest."</a></li>";   
    }?>
</ul>

然后我使用点击功能，根据上面生成的下拉菜单的 selection 获取子文件夹中的所有文件：

   $(document).ready(function(){
        $('.demolist_scn').on('click', function(){  
            var scenarioName =  $(this).find("a").text(); // GET THE VALUE OF DROPDOWN MENU
            $("#dropdown-menu-id_scn").dropdown("toggle"); // CLOSE THE DROPDOWN MENU AFTER SELECTION   
        var path = 'Code/python/output/Scenarios/'+scenarioName+'/*.shp';
            // ajax request which will return all the files in the subfolder
            $.ajax({
                type:'POST',
                url:'populate_shapes_dropdown.php',
                data: {path:path},
                success:function(response){
                    $("#dropdown-menu-id").html(response);
                } 
            });
            return false; // prevents refreshing page
        }); 
    });

这是 PHP 脚本：

<?php
 ini_set('display_errors', 1);
 $path = $_POST['path'];
 echo($path);
foreach(glob($path) as $filename){
  // GET INDEX
  $pos = strpos($filename, 'Scenarios/');
  //echo ($filename);
  // GET SUBSTRING WITH SHAPE NAME
  $rest = substr($filename, $pos+21);
  echo $options="<li class='demolist'><a href='#'>".$rest."</a></li>";                              
 }
?>

我按如下方式填充第二个下拉菜单：

<ul id="dropdown-menu-id" class="dropdown-menu" role="menu">
    <?= $options?>
</ul>

现在问题来了。当我尝试 select 第二个下拉菜单中的值之一时，没有任何反应。虽然我添加了这个 onclick 事件：

$(document).ready(function(){
        $('.demolist').on('click', function(){
            alert('something');
});

我在这里错过了什么？一定是简单的东西我看错了，没看到

Answer 1

嗯，开始吧。

这个：

$('demolist').on('click', function(){

应该是这样的：

$('.demolist').on('click', function(){ //note the dot referring to a class

对于动态添加的元素，您可能需要委托他们做这样的事情。参考：http://api.jquery.com/on/

$('.dropdown-menu').on('click','.demolist', function() {

无法 select select 下拉菜单中的值

Unable to select a value from dropdown menu on select

php

jquery

dropdown