Jquery 在 Sharepoint 中不工作

Posted 2023-03-27

技术标签:

【中文标题】Jquery 在 Sharepoint 中不工作【英文标题】：Jquery Not working in Sharepoint 【发布时间】：2011-10-04 08:39:42 【问题描述】：

我想做一个包含 Jquery 效果的 webpart，比如切换。

当我们单击该工具旁边的图像时，我们需要显示一个菜单的资源...为此我想使用 jquery 切换

我在 sharepoint 母版页中添加了以下链接

<SharePoint:ScriptLink language="javascript" name="/_layouts/NMFSHeaderLinks/jquery-1.4.1-vsdoc.js"  Defer="true" runat="server"/>

在可视化 webpart 中

<style type="text/css">
    a:hover
    
        text-decoration:none;
        font-weight:bold;
    
    .style1
    
        width: 8px;
        height: 7px;
    
</style>

<script type="text/javascript" src="../../../_layouts/NMFSHeaderLinks/jquery-1.4.1-vsdoc.js">


    $(document).ready(function () 
        $('#hpTools').click(function () 
            alert('Entered in jquery');
            $("#divtools").toggle("slow");
        );
    );


</script>

<table id="td">
<tr>
<td>
<asp:HyperLink ID="hpBlueBook" runat="server" Font-Bold="False" 
    Font-Size="Small" ForeColor="#F19005" NavigateUrl="http://Sparsh" >Blue Book</asp:HyperLink>
&nbsp; |&nbsp;
</td>
<td><asp:HyperLink ID="hpReports" runat="server" Font-Bold="False" 
    Font-Size="Small" ForeColor="#F19005" NavigateUrl="http://Sparsh">Reports</asp:HyperLink>

&nbsp;|</td>
<td>
<asp:HyperLink ID="hpTools" runat="server" Font-Bold="False" 
    Font-Size="Small" ForeColor="#F19005" >Tools</asp:HyperLink>
&nbsp;<img  class="style1" id="tools"
        src="../../../_layouts/images/NMFSHeaderLinks/DropDown.png" />&nbsp;|&nbsp;


</td>
<td>
<asp:HyperLink ID="hpResources" runat="server" Font-Bold="False" 
    Font-Size="Small" ForeColor="#F19005" >Resources</asp:HyperLink>

&nbsp;<img  class="style1" 
        src="../../../_layouts/images/NMFSHeaderLinks/DropDown.png" />&nbsp;|
</td>
<td>
<asp:HyperLink ID="hpQuickLinks" runat="server" Font-Bold="False" 
    Font-Size="Small" ForeColor="#F19005" >Quick Links</asp:HyperLink>

&nbsp;<img  class="style1" 
        src="../../../_layouts/images/NMFSHeaderLinks/DropDown.png" />
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td> <div id="divtools" style="display:none">
            <asp:Menu ID="ToolsMenu" runat="server" BackColor="#F7F6F3" 
                DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" 
                ForeColor="#7C6F57" StaticSubMenuIndent="10px">
                <DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />
                <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                <DynamicMenuStyle BackColor="#F7F6F3" />
                <DynamicSelectedStyle BackColor="#5D7B9D" />
                <Items>
                    <asp:MenuItem NavigateUrl="http://www.google.com" Text="Google" Value="Google">
                    </asp:MenuItem>
                    <asp:MenuItem NavigateUrl="http://www.yahoo.com" Text="Yahoo" Value="Yahoo">
                    </asp:MenuItem>
                </Items>
                <StaticHoverStyle BackColor="#7C6F57" ForeColor="White" />
                <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                <StaticSelectedStyle BackColor="#5D7B9D" />
            </asp:Menu>
        </div></td>
        <td>
        <div id="Reports">
            <asp:Menu ID="Menu1" runat="server" BackColor="#F7F6F3" 
                DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" 
                ForeColor="#7C6F57" StaticSubMenuIndent="10px">
                <DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />
                <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                <DynamicMenuStyle BackColor="#F7F6F3" />
                <DynamicSelectedStyle BackColor="#5D7B9D" />
                <Items>
                    <asp:MenuItem NavigateUrl="http://www.google.com" Text="Static" Value="Google">
                    </asp:MenuItem>
                    <asp:MenuItem NavigateUrl="http://www.yahoo.com" Text="Dynamic" Value="Yahoo">
                    </asp:MenuItem>
                </Items>
                <StaticHoverStyle BackColor="#7C6F57" ForeColor="White" />
                <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                <StaticSelectedStyle BackColor="#5D7B9D" />
            </asp:Menu>
        </div>
        </td>
        <td>
        <div id="QuickLinks">
            <asp:Menu ID="Menu2" runat="server" BackColor="#F7F6F3" 
                DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" 
                ForeColor="#7C6F57" StaticSubMenuIndent="10px">
                <DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />
                <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                <DynamicMenuStyle BackColor="#F7F6F3" />
                <DynamicSelectedStyle BackColor="#5D7B9D" />
                <Items>
                    <asp:MenuItem NavigateUrl="http://Sparsh" Text="Sparsh" Value="Google">
                    </asp:MenuItem>
                    <asp:MenuItem NavigateUrl="http://webmail/owa" Text="Mail" Value="Yahoo">
                    </asp:MenuItem>
                </Items>
                <StaticHoverStyle BackColor="#7C6F57" ForeColor="White" />
                <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                <StaticSelectedStyle BackColor="#5D7B9D" />
            </asp:Menu>
        </div>
        </td></tr>
</table>

但它不会去点击功能... 请让我知道我该如何继续....我也尝试使用图像 ID。但不工作

【问题讨论】：

【参考方案1】：

从脚本块中删除 src。另外，我不确定延迟加载是否会导致在执行脚本块时 $ 未定义。

【讨论】：

【参考方案2】：

我不确定它是否会导致您出现问题，但是如果您有一个带有 SRC 的脚本标签和标签本身的内容，这将无济于事。您需要在没有提供 SRC 属性的情况下围绕 Jquery 使用单独的标签。

【讨论】：

【参考方案3】：

问题确实是延迟加载造成的，我在这篇文章中使用了类似的解决方案：Possible to defer loading of jQuery?

【讨论】：

【参考方案4】：