文章/答案/技术大牛

发布

社区首页 >问答首页 >jQuery .on()不会触发任何事件

问jQuery .on()不会触发任何事件
EN

Stack Overflow用户

提问于 2013-05-30 21:34:12

回答 2查看 193关注 0票数 1

我正在使用jQuery编写一个应用程序，当单击按钮时，会生成一个选择框并将其附加到一行。每当select发生变化时，它都应该触发change事件，但是使用.on("change", function() {});是行不通的：

代码：

<!DOCTYPE html>
<html>
    <head>
        <title>HTML5-Template</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <style type="text/css">
            html, body
            {
            }

            input,select {
                border: 1px solid #404048;
                padding: 4px;
            }
        </style>
        <script type="text/javascript" src="../JavaScript/JQuery/jquery-1.9.1.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $("#cmdCreateRow").click(function() {
                    var row = $("<div />")
                    .css("font", "normal 12px Verdana")
                    .css("padding", "8px")
                    .css("display", "inline-block")
                    .css("background", "#F0F0F8")
                    .css("border", "1px solid #A0A0A8")
                    .css("margin", "2px");

                    var types = [
                        "Local", 
                        "Remote",
                        "(Custom)"
                    ];

                    var type = $("<select />").attr("class", "member-type");
                    for(var i in types) {
                        type.append($("<option />").val(types[i]).text(types[i]));
                    };

                    row.append(type);

                    $("#Container").append(row).append($("<br />"));
                });

                $(".member-type").on("change", function() {
                    alert("changed");
                });
            });
        </script>
    </head>
    <body>
        <input type="button" id="cmdCreateRow" value="Create Row" />
        <div id="Container">
        </div>
    </body>
</html>

你知道我做错了什么吗？

javascript

jquery

html

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-05-30 21:34:57

当你绑定的时候$(".member-type")是空的，所以你什么也没做。

变化

$(".member-type").on("change", function() {
       alert("changed");
});

至

$(document).on("change", ".member-type", function() {
         alert("changed");
});

或者这是因为#Container元素是静态的：

$("#Container").on("change", ".member-type", function() {
         alert("changed");
});

票数 9

Stack Overflow用户

发布于 2013-05-30 21:36:02

试试这个：

$(document).on("change", ".member-type", function() {
    //Code
});

这是jQuery中"live“的替换，请参阅：http://api.jquery.com/live/

常规的"on“方法只对DOM中已有的元素有效。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/16837686

复制

相似问题

问jQuery .on()不会触发任何事件
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery .on()不会触发任何事件EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery .on()不会触发任何事件
EN