通过CSS和Jquery动态访问生成的嵌套内容

Question

我正在尝试访问表和div中的锚链接。我没有任何机会访问CSS属性，这样我就可以用jQuery捕获一个单击事件。这个内联对话框的内容是动态生成的。

<div id="cds-cad-inline-dialog" style="">
    <div>The model you requested has been successfully generated.</div>
    <table>
        <tbody>
            <tr>
                <td>
                    <div>
                        <a href="alinktoadownloadfile">Download File</a>
                    </div>
                </td>
            </tr>
        </tbody>
   </table>
</div>

我尝试过以下几种方法：

            $("div.a#cds-cad-container").click(function () {
                $("#cds-cad-static-3D-viewer").show();
                $("#cds-cad-inline-dialog").hide();
            });

和

            $("div.table.tbody.tr.td.div.a").click(function () {
                $("#cds-cad-static-3D-viewer").show();
                $("#cds-cad-inline-dialog").hide();
            });

任何帮助都将不胜感激。

编辑：

之前的代码

    <form id="_3d" runat="server">
        <div id="show_3d" runat="server" style="display:block;width:635px">
            <div id="cds-cad-container">
                <div id="cds-cad-inline-dialog" style="display:none;"></div>

之后的代码

请参见上面的。

Answer 1

$("#cds-cad-container").on("click","table div a",function(event){
    alert("hello world, href : "+$(this).attr("href"));
    event.preventDefault();
});

Answer 2

您的选择器不正确。试一试

$("#cds-cad-container a").click(function () {

您之前的“div.a#cds-cad- div”尝试选择一个类为a的容器。

和

$("div table tbody tr td div a").click(function () {

你在这个例子中使用了点，这是一个类选择器。使用空格可以选择可能包含中间图元的嵌套图元。

Answer 3

就像添加一样，如果您使用$("#cds-cad-container a").click(function () { //your code });，那么请确保只有一个您想要添加单击事件的锚点标记。

这会将click事件附加到id为cds-cad-container的div下的所有可用锚点标记上。

为了避免这种情况，你可以写这样的代码：

var test = $("#cds-cad-container a")[0].onclick = function(){console.log("test")};

这将仅将单击事件附加到id为cds-cad-container的div下的第一个锚标记上。

希望这能有所帮助。