Question

我有iframe：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<link rel="stylesheet" type="text/css" href="jquery-ui-1.9.2.custom.css">
<div id="slider"></div>
</body>
</html>

我有页面：

<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script src="jquery-ui-1.9.2.custom.js"></script>
<title></title>
</head>
<body>
<iframe id="frame" src="iframe.html" width="800" ></iframe>
<script type="text/javascript">
$(document).ready(function() {
    $('#frame').contents().find('#slider').slider({
        value:2,
        min: 0,
        max: 6,
        step: 1,
        animate: true,
        slide: function( event, ui ) {
        }
    });
});
</script>
</body>
</html>

我只想在iframe中使用自定义滑块，但这不起作用，我不知道为什么。这项工作完美没有iframe。

更新：通过调用从iframe

创建滑块的功能来解决问题

Answer 1

iframe是一个单独的html页面（不同的文档），由于安全原因，无法访问父级脚本等。

你需要包含jQuery＆amp; iframe html文档中的jQuery UI，并在该文档中运行该函数。

以下是对原因的全面总结： http://javascript.info/tutorial/same-origin-security-policy

JqueryUi滑块在iframe中不起作用

1 个答案: