Javascript 尝试在通过数据属性附加的另一页上附加JQuery

我有一个滑块，通过数据属性连接外部页面的幻灯片

下面是正在发生的事情：-

主页

$（function（）{//在DOM就绪时运行
$（'.internalclick'）。单击（函数（e）{
警报（“我单击了区域标记”+$（this.attr（'data-direct'））；
});
});

幻灯片页面（Slides page.html）

问题 现在，当我尝试在幻灯片页面中的两个列表元素（幻灯片）上添加单击功能时，所有这些都可以正常工作。注意我添加的第一个

href=“#”class=“internalclick”data direct=“I-need-to-direct”

。现在的问题是如何访问它

当我试图在主页中运行一个小的单击功能时，我无法运行该功能。你知道我如何在幻灯片页面中创建一个单击函数来限定区域标记的范围吗

---

谢谢

问题是在添加事件处理程序后，

内部单击

被加载。您需要使用事件委派

$("#sitewrapper").on("click",".internalclick", function(e) { 
    var direct = $(this).data("direct");
    console.log(direct);
});

---

为什么不使用

.data（）

？问题在于幻灯片代码使用了iframe，或者在幻灯片加载内容之前附加了单击<代码>$（“#sitewrapper”）。在（“单击”，“内部单击”，函数（e）{console.log（$（this.data（“direct”）；}）非常感谢您。也许你可以把它写下来作为我接受它的答案？谢谢

    <li class="hslide" data-id="1"><img src="content/01.png" usemap="#Map">
      <map name="Map">
        <area shape="rect" coords="331,158,538,297" href="#" class="internalclick" data-direct="I-need-to-direct">
        <area shape="rect" coords="546,154,745,305" href="#">
        <area shape="rect" coords="331,311,543,445" href="#">
        <area shape="rect" coords="550,309,733,443" href="#">
      </map>
    </li>
    <li class="hslide" data-id="2"><img src="content/02.png"></li>
    <li class="hslide" data-id="3"><img src="content/03.png"></li>
    <li class="hslide" data-id="4"><img src="content/04.png"></li>

$("#sitewrapper").on("click",".internalclick", function(e) { 
    var direct = $(this).data("direct");
    console.log(direct);
});