Question

$(document).ready()内部是.on('click')事件处理程序。它绑定到一个空div，我们称之为parentContainer。

点击处理程序如下所示：

$('#parentContainer').on('click', #buttonthatWILLexisteventually, (function() { doStuff(); }));

问题是，我想最终使用的对象还不存在。我有另一个函数，它使用.appendTo（）jQuery函数将输入文本字段，按钮（包括#buttonthatWILLexisteventually）和其他东西插入#parentContainer。

我希望#buttonthatWILLexisteventually（以下称#btwee）要做的是在单击按钮时读取附加了它的文本字段的当前值。

当我取消所有$（文档）.ready并插入HTML废话并坚持使用静态HTML时，它在jsfiddle中工作。

<div class="parentContainer">
        <h2>Server Log</h2>
        <div>
            <input type="text" name="Filter" id="logfilter" value="Filter Log by [id]" />
            <input type="checkbox" id="logdebug" />
            <label for="logdebug">Display Debug Messages</label>
            <button class="changeNestedSetting" id="logclear">Clear</button>
            <button class="changeNestedSetting" id="logview">View Log</button>
        </div>
        <div id="iframediv"></div>
    </div>





  (function () {
    $(document).ready(function () {
        $('.parentContainer').on('click', '#logview',(function(){
            console.log($("#logfilter").val());
            $('<div width="100%" height="600" id="logiframe"></div>').appendTo('div#iframediv');
            var logurlparam =  { filterlog: $("#logfilter").val() };
            var logurl = "echo/html?ID=" + logurlparam["filterlog"];
            $.ajax({
                type: "GET",
                url: logurl,
                dataType: "html",
                success: function (html) {
                    $('<pre>' + html + '</pre>').appendTo('div.log');
                    $('div#logiframe').contents().find('body').append('<pre>' + html + '</pre>');
                }
            });
        }));
    });
    }());

http://jsfiddle.net/Rx3dV/15/

不幸的是，真实世界的例子似乎创造了一个捕获22;将click处理程序绑定到父级似乎暗示当我在该父级内部创建按钮时，单击处理程序绑定但我失去了动态读取文本字段内容的能力;该值始终是默认值（请参阅：http://jsfiddle.net/k5rD2/1/）。另一方面，尝试使用与创建内部内容相同的代码执行click事件意味着它不会绑定。

我在此看到的大多数其他主题都建议使用.keyup（）或.keypress（）来“猜测”输入的内容;对于一个相当简单的问题，这似乎是一个可怕的解决方案，但到目前为止我还没有找到更好的方法。

更新：有一位JavaScript程序员今晚和我一起查看我的代码，看看我做错了什么。我设法把他弄糊涂;我们唯一可以提出的可能是jquery-ui（在页面的其他地方使用）与它有关吗？

Answer 1

所以代码工作...在隐形标签内容中的同名div中，它在我在DOM中工作的那个之前。

修复我在jquery-ui中使用制表符的方式使问题消失。

.val（）检索默认值，而不是类型化值

1 个答案: