Question

我在页面上有几个动态创建的元素，我想使用jQuery将内容发布到另一个页面。问题是，创建的元素无法通过jQuery访问（只有页面上存在的元素可以使用$（＃myElementID）访问。我已经看过数百篇使用live（）和on（）函数访问EVENTS的帖子，但无法访问动态创建的ELEMENTS的任何属性，值，innerHTML等。这是不可能用jQuery做的吗？

    $('#btnParseTable').click(function () {
        var tblCustomPattern = $("#tblCustomPattern").innerHTML; 


   //This test alert yields "" because tblCustomPattern is undefined - yet FireBug clearly shows the table exists!
        alert(tblCustomPattern); 


 var postData = { "method": "ParseTable", "tbl": tblCustomPattern };
        $.post("tiler.aspx", postData, function (data) {
            $("#test").html(data); //for testing
        });

});

如果jQuery不支持，可以在JavaScript中完成，或者不能回发非＆＃34; INPUT＆＃34;元件？

Answer 1

此测试警报产生“”，因为tblCustomPattern未定义 - 但FireBug清楚地表明该表存在！

您可以在将动态创建的元素添加到DOM后对其进行评估。 tblCustomPattern是undefined，因为jQuery对象没有属性innerHTML您需要使用DOM元素innerHTML，但选择器将返回jQuery对象。您可以使用索引器[]或[get()][1]从jQuery对象获取html元素。它是zero-based索引，您将获得零index的第一个元素。

var tblCustomPattern = $("#tblCustomPattern")[0].innerHTML;

或，使用.get()

var tblCustomPattern = $("#tblCustomPattern").get(0).innerHTML;

或使用html()

var tblCustomPattern = $("#tblCustomPattern").html();

Answer 2

在代码的这一部分中，您遇到了一个问题：

$("#tblCustomPattern").innerHTML;

问题是$("#tblCustomPattern")是一个jQuery对象。它不是DOM对象。 jQuery对象没有属性.innerHTML。

因此，要解决您的问题，您有以下几种选择：

您可以从jQuery对象中获取DOM元素，然后直接在DOM对象上使用.innerHTML属性。
您可以通过调用jQuery .html()方法将jQuery方法用于此相同功能。
你甚至根本不需要jQuery，所以你可以使用普通的JS。

所以，其中任何一个都可行：

// get the first DOM object from the jQuery object
//    two different methods for doing that
var tblCustomPattern = $("#tblCustomPattern")[0].innerHTML; 
var tblCustomPattern = $("#tblCustomPattern").get(0).innerHTML; 

// use the jQuery method to get the HTML
var tblCustomPattern = $("#tblCustomPattern").html();

// use plain JS - fastest option
var tblCustomPattern = document.getElementById("tblCustomPattern").innerHTML;

如何使用jQuery访问动态创建的页面元素（不是事件，ELEMENTS！）

2 个答案: