Javascript $（“.class”）.val（）正在返回未定义的值

我正在连接到TrelloAPI，并用一块板上的列表创建一个应用程序。然后我尝试列出每个列表中的所有卡片。从value属性获取ListID时，它返回undefined。为什么会这样

我用document.getElementByIddemo.innerHTML=$.board.val打印出来

HTML输出如下所示：

<label>Choose from a List of Boards</label>
    <div id="output">
        <select id="boards">
            <option target="trello" value="LIST_ID" name="LIST_ID" id="LIST_ID" class="board">
                List One
            </option>
            ...
        </select>
    </div>

<label>Display Cards Below for Board Selected</label>
<div id="outputCards"></div>

<p id="demo">undefined</p>

---

我认为这里的主要问题是board类只被添加到Trello.get回调中的元素中

由于此代码是异步执行的，很可能是在执行回调中的代码之前执行了$.board.val，这意味着`$.board没有返回任何元素

我会考虑这样的事情

Trello.get("/boards/BOARD_ID/lists", function(boards) {
        $boards.empty();
        $.each(boards, function(ix, board) {
            $("<option>")
            .attr({href: board.url, target: "trello", value : board.id, name : board.id, id : board.id})
            .addClass("board")
            .text(board.name)
            .appendTo($boards);
        });  
        // This is where I'm trying to return the value

        $('#board').change(function () {
            document.getElementById("demo").innerHTML = $(".board:selected").val();
        });
    });

---

我不知道Trello是什么，但我猜Trello.get执行异步操作，因此在运行$.board.val行时，.board元素还没有创建。如果$.board不匹配任何元素，则And.val将返回undefined。任何依赖.get结果的代码都需要在该回调函数中，或者在从那里调用的其他函数中。谢谢，修复了它！但是现在它为默认情况下加载的第一个列表拉入ID，但在我从列表中选择新选项时不会更新。有没有办法解决这个问题？@user994585我已经用一个补丁更新了代码，还没有测试过，但我认为应该可以。将change函数绑定到select，这样当所选选项更改时，它会用所选值更新demo元素。

Trello.get("/boards/BOARD_ID/lists", function(boards) {
        $boards.empty();
        $.each(boards, function(ix, board) {
            $("<option>")
            .attr({href: board.url, target: "trello", value : board.id, name : board.id, id : board.id})
            .addClass("board")
            .text(board.name)
            .appendTo($boards);
        });  
        // This is where I'm trying to return the value

        $('#board').change(function () {
            document.getElementById("demo").innerHTML = $(".board:selected").val();
        });
    });