Question

这是一个场景：从 create.jsp ，我创建了一个播放按钮和一个音频标签，如下所示：

//play button
out.write("<input type=\"button\" id=\"playButton\" value=\"Play Now\" >");
out.write("");

//audio element
out.write("<audio id=\"sound\" preload=\"auto\">");
//out.write("<source src=\"sfl\" type=\"audio/ogg\" />");
out.write("<source src=\"sfl\" type=\"audio/mpeg\" />");
out.write("Your browser does not support the audio element.");
out.write("</audio>");

我使用框架将其带到 home.jsp ，如下所示：

<iframe id='bgframe' style='display:compact;' src='create.jsp' width="400" height="200"></iframe>

在我的jquery代码中，我有

    $("#playButton").click(function(){
    alert("Play button clicked");
    }

但是当我点击playButton时没有任何反应。

问题：如何使用jquery或javascript捕获通过框架部署的playbutton上的点击事件？

Answer 1

按照设计，来自父框架的JavaScript不能对iframe中包含的元素起作用。

Answer 2

试试这个

out.write("<script>function(){//your code here}</script>");
out.write("<input type=\"button\" onclick=\"demo()"\ id=\"playButton\" value=\"Play Now\" >");

或

out.write("<script src="file name where code is placed"></script>");
out.write("<input type=\"button\" id=\"playButton\" value=\"Play Now\" >");

Answer 3

您需要使用contents()

$("#bgframe").contents().find("#playButton").click(function(){
    alert("Play button clicked");
}

如何在框架中的元素上使用javascript

3 个答案: