iframe内的手风琴

时间:2014-07-25 10:30:37

标签: jquery jquery-ui iframe jquery-ui-accordion

我有一个场景,我的iframe通过onclick函数动态加载。

我正在尝试在iframe中使用accordion,但accordion()函数无效。

下面是我的jquery代码

 $(function() {
    $("#accordion").accordion();

 });

有什么解决方案吗?

iframe代码:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
   <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">    
 <script>
     $(function() {
      $("#accordion").accordion();
         });
 </script>
 </head>
<body>

<% ApplicationBean app= (ApplicationBean)request.getAttribute("app");%>
<c:out value="${app.getAppName()}"/>

    <div id="accordion">
        <h3>Application</h3>
        <div>
            <p></p>
                <table>
                    <tr>
                        <td>Application Name</td>
                        <td><c:out value="${app.getAppName()}"/></td>
                    </tr>
                    <tr>
                        <td>Service URL</td>
                        <td><c:out value="${app.getServiceUrl()}"/></td>
                    </tr>
                    <tr>
                        <td>Deploy Time</td>
                        <td><c:out value="${app.getDeployTime()}"/></td>
                    </tr>
                    <tr>
                        <td>Status</td>
                        <td>
                            <c:choose>
                                <c:when test="${app.isRunning()==true}">Running</c:when>
                                <c:otherwise>Down</c:otherwise> 
                            </c:choose>
                        </td>                       
                    </tr>
                    <tr>
                        <td>WSDL</td>
                        <td>
                            <c:out value="${app.getWsdls() }"></c:out>                  
                    </tr>
                </table>

        </div>
        <h3>Libraries</h3>
        <div>
            <p></p>
        </div>
        <h3>Message Flows</h3>
        <div>
            <p></p>
        </div>
    </div> 

我添加了jquery&amp; parent.html中的jquery-ui文件

2 个答案:

答案 0 :(得分:0)

accordion()所需的所有js必须位于iframe 中。这包括jquery和jquery-ui以及 CSS文件(jquery-ui.css)

答案 1 :(得分:0)

您的手风琴初始化代码如下:

$(function() {
    $("#accordion").accordion();

 });

如果我认为您的父网页为parent.html,并且您用作iframe的网页为iframe.html,则代码应位于iframe.html页面而不是{{1}页面。