Question

我是jQuery的新手，我正在尝试理解我刚写的一些代码。

我有一个简单的HTML

<body>
    <div id="theDiv">
        <button>This is the div</button>
    </div>
</body>

我的脚本看起来像这样

$(document).ready(function(){
    $("button").on("click",function(){
        $("<div></div>").attr("id","myDiv").appendTo("#theDiv");
        $("<select></select>").addClass("mySelects").appendTo("#myDiv");
    });
    $(".mySelects").on("click",function(){
        console.log("Do some stuff here");
        $('<option value="Text">Text</option>').appendTo(".mySelects")
    });
});

所以我要做的是添加一个div select并将select添加到一个类中。上面的scpipt不起作用，我不知道为什么，而下面的代码可以解决这个问题

$(document).ready(function(){
    $("button").on("click",function(){
        $("<div></div>").attr("id","myDiv").appendTo("#theDiv");
        $("<select></select>").addClass("mySelects").appendTo("#myDiv");
        $(".mySelects").on("click",function(){
            console.log("Just added the class");
            $('<option value="Text">Text</option>').appendTo(".mySelects")
        });
    });
});

我希望你们中的一些jQuery Gurus可以解释我发生了什么，因为我自己并不是很了解它。

这是我使用http://jsfiddle.net/k1stLsft/2/

的小提琴

干杯。

Answer 1

以下是添加select选项的几个选项。第一个是代表，就像乔治建议的那样：

   $("body").delegate(".mySelects", "click",function(){
        console.log("Just added the class");
        $('<option value="Text">Text</option>').appendTo(".mySelects")
    });


    $(document).on("click", ".mySelects",function(){
        console.log("Just added the class");
        $('<option value="Text">Text</option>').appendTo(".mySelects")
    });

Fiddle

Answer 2

正如一对人已经说过，当你设置onclick事件时，你想要事件的元素还不存在。你需要像这样使用jQuery委托。

$("body").on("click", ".mySelects", function() {...});

Answer 3

在单击按钮之前，<select>类.mySelects不存在。

在jQuery中创建新元素的问题

3 个答案: