0

我正在使用 Visual Studio 2010 / C# 4.0 / MVC 3 / Razor / jQuery 1.5.1 / Google Chrome 21.0.1180.83 m / Windows 7 Enterprise

这是我的确切代码，其中注释掉了非显着的东西（我认为是非显着的）。

基本上我正在创建一个<input />元素，并且如果用户更改其值，我会尝试将更改事件绑定到它，但该事件似乎没有绑定。当我查看 Google Chrome (Ctrl + Shift + J) 中的元素时，我在“事件侦听器”下看不到任何内容。

<script type="text/javascript" src="/scripts/jquery-1.5.1.js"></script>

<script type="text/javascript">

$(function () {
// ...

    $('#StoredProcedureName').change(function () {
        // ...

        var parameters = $('#parameters');  // <table id="parameters"></table>

        $.getJSON('@Url.Action(/* */)', {
            // ...
        }, function (data) {
            parameters.empty();
            // ...
            $.each(data, function (k, v) {
                // ...
                parameters.
                    append($('<tr />').
                        // ... Other <td /> elements
                        append($('<td />').
                            append($('<input />').
                                // ...
                                change(function () {
                                    alert("here2"); // This alert isn't happening.
                                }).
                                addClass('testClass'). // This class is showing up though.
                                // ...
                            )
                        )
                    );
            });

            // ...
        });
    });

    // ...
});

</script>

当我制作一个测试 MVC 网站并执行此操作时，它似乎可以工作。这太令人费解了。

<!DOCTYPE html>

<html>
<head>
    <title></title>

    <script type="text/javascript" src="../../Scripts/jquery-1.5.1.js"></script>

    <script type="text/javascript">
        $(function () {
            $("#a").append(
                $("<input />").change(function () {
                    alert("here1");
                }).attr('value', 'text')
            );
            $("#b").change(function () {
                alert("here2");
            });
        });
    </script>
</head>
<body>
    <div id="a">
    </div>
    <input id="b" />
</body>
</html>

谁能告诉我为什么我的第一个警报没有被执行，尽管<input />元素出现了，并且有正确的类？

编辑：

正在创建表以及输入元素：

Chrome 检查器的屏幕截图

4

3 回答 3

0

你能在没有表格元素的情况下试试吗？

我只是想知道你是如何做到这一点的：

append($('<tr />')

我希望这是一个封闭的表格行，同样与

append($('<td />')

看看这个表格构建的例子

在jQuery中添加表格行

于 2012-08-24T10:53:53.867 回答
0

我个人会尝试向输入字段添加一个类并使用 jqueries Live() 函数而不是普通绑定。
您可以将 onclick 绑定到具有类 foo 的所有输入。 如果您不喜欢直播，请
在此处了解有关 Live 的信息，您可以尝试不立即执行 .change 绑定，而是像在工作示例中那样在其 id 上调用一个额外的 jquery 选择器吗？

于 2012-08-24T11:28:04.403 回答
0

随意编辑这个解释。但基本上在我的代码中，我对表格元素进行了如下排序：

var options = parameters.children();
options.sort(function (a, b) {
    if (a.text > b.text) return 1;
    else if (a.text < b.text) return -1;
    else return 0
});
parameters.empty().append(options);

删除这个（我不知道为什么我有它）起到了作用。

于 2012-08-24T11:36:23.547 回答