Question

我知道这个问题已被问到，但我没有找到任何满意的答案。我有一个非常简单的html页面，我想加载到许多其他页面。这没问题，但是我遇到的问题是这个html页面有一个jQuery悬停函数，它根本不会在其他页面上执行。我已经尝试将悬停功能放在每个页面上，我尝试过.getScript。据我所知，jQuery将从.load（）页面加载脚本，执行它们，然后删除它们。但由于它是一个悬停功能，我需要这些脚本保持不变。有什么方法可以做到这一点吗？如果有必要，我会发布代码，但它完美无缺，所以我认为不是......

每页

：

    if ($("#zz7_Menu:contains('myname')")) {
    $("#toolbar").load('toolbar.html table.toolbaradmin');
}
else {
    $("#toolbar").load('/toolbar.html table.toolbar');
}

toolbar.html：

<script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script>
<link rel="stylesheet" href="jquery-ui/css/redmond/jquery-ui-1.8.13.custom.css" type="text/css" media="all" />

<script>
    $(document).ready(function() {
    $('.ui-state-default').hover(function() {
        $(this).removeClass('ui-state-default').addClass('ui-state-hover');
    },
    function() {
        $(this).removeClass('ui-state-hover').addClass('ui-state-default');
    });
    });
</script>

<table class="toolbar">
    <tr>
        <td class="ui-state-default ui-corner-all toolbar">

等...

Answer 1

尝试将悬停代码移动到一个独立的JavaScript文件中（您可以使用<script src="...">加载到任何地方）。

现在使用jQuery在.load()成功完成后再次安装悬停函数调用。提取后，这应该是一行代码。

Answer 2

将影响表格的javascript移动到表格后面。由于文档已经准备好，它会立即运行，这恰好在将表添加到页面之前。此外，如果jquery已经包含在父页面中，则不需要在要加载的页面中包含jquery。

<table>
  <!-- ... table stuff ... -->
</table>
<script>
    $(document).ready(function() {
    $('.ui-state-default').hover(function() {
        $(this).removeClass('ui-state-default').addClass('ui-state-hover');
    },
    function() {
        $(this).removeClass('ui-state-hover').addClass('ui-state-default');
    });
    });
</script>

带脚本的jQuery .load（）

2 个答案: