执行动态加载的jQuery代码_Jquery

执行动态加载的jQuery代码

jquery

执行动态加载的jQuery代码,jquery,Jquery,我正在开发使用.load函数动态加载页面的网站。例如：index.php包含链接，该链接在被单击后加载其他页面。另一个页面包含html和一些jQuery代码（插件初始化等）。问题是jQuery代码在动态加载后无法工作。Index.php代码： <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Example</t

我正在开发使用.load函数动态加载页面的网站。例如：index.php包含链接，该链接在被单击后加载其他页面。另一个页面包含html和一些jQuery代码（插件初始化等）。问题是jQuery代码在动态加载后无法工作。Index.php代码：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Example</title>

<script type="text/javascript">
    $(document).ready(function(){
        $(".load-page").click(function(){
            $('.loaded-page-container').load('some_page_url', function(data, status, xhr) {
                alert('page is loaded');
            });
        });     
    });
</script>

</head>

<body>

<a href="#" class="load-page">Load page</a>

<div class="loaded-page-container"></div>

</body>
</html>


例子
$（文档）.ready（函数（）{
$（“.load page”）。单击（函数（）{
$（'.loaded page container'）.load（'some_page_url'，函数（数据、状态、xhr）{
警报（“页面已加载”）；
});
});     
});

和加载页面的代码：

<script type="text/javascript" src="autoNumeric-1.7.4.js"></script>

<script type="text/javascript" src="selectmenu/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="selectmenu/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="selectmenu/ui/jquery.ui.position.js"></script>
<script type="text/javascript" src="selectmenu/ui/jquery.ui.selectmenu.js"></script>

<script type="text/javascript">
    $('#number').autoNumeric({mDec:0,vMax:'9999999'});  //these statements doesn't work 
    $('#select').selectmenu({
        width: 289
    });     
</script>

<div class="some-content">
    HTML code that appears after current page loading. 
    <input type="text" value="" name="number" id="number" />
    <select id="select">
        <option value="some-val">Some value</option>
    </select>
</div>


$（'#number'）。自动数字（{mDec:0，vMax:'999999'}）//这些说法行不通
$（'#选择'）。选择菜单({
宽度：289
});     
当前页面加载后显示的HTML代码。
一些价值

因此页面被加载，但不幸的是jQuery插件无法工作。有什么想法吗？

谢谢你的帮助

您需要将所有JS代码保留在第一页，而不是第二页

AJAX调用完成并完成填充后，可以触发javascript

<!--ALL scripts linked in this page-->
$.ajax({
    url: "some_page_url",
    success: function( data ) {
        <!--LOADING ONLY THE HTMLs-->
        $('.loaded-page-container').html(data);
        alert('page is loaded');
    },
    complete: function( data ) {
        $('#number').autoNumeric({mDec:0,vMax:'9999999'});  
        $('#select').selectmenu({
            width: 289
        }); 
    }
});


$.ajax({
url:“某个页面的url”，
成功：功能（数据）{
$（'.loaded page container'）.html（数据）；
警报（“页面已加载”）；
},
完成：功能（数据）{
$（'#number'）。自动数字（{mDec:0，vMax:'999999'}）；
$（'#选择'）。选择菜单({
宽度：289
}); 
}
});

此外，您需要检查插件是否可以在动态生成的html上工作。

您可以使用

jQuery.getScript（）

，如下所述：