Question

我已经下载并安装了jQuery UI 1.8.17，我尝试应用Accordion，但没有运气。

我的代码如下：

HTML

<html>
<head>
    <title>Document Title</title>
    <link href="../../css/tinyMCE/jquery_ui_wp_theme/jquery-ui-1.8.17.custom.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="../../js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="../../js/jquery-ui-1.8.17.custom.min.js"></script>
    <script type="text/javascript" src="js/shortcodes.js"></script>
</head>
<body>
    <div id="codes">
        <h3><a href="#">Shortcode name</a></h3>
        <div><p>Dialog content</p></div>
        <h3><a href="#">Shortcode name</a></h3>
        <div><p>Dialog content</p></div></div>
    </div>
</body>
</html>

的JavaScript

jQuery(document).ready(
    function($)
    {        
        $('#codes').accordion();
    }
);

上述代码的问题在于，虽然手风琴正确呈现，但根本不起作用。这意味着，当我点击手风琴面板标题时，没有任何动作。

此外，在我的控制台中，我没有收到任何JavaScript错误，并且所有文件都正常加载。关于如何解决这个问题的任何想法？！

This is the accordion as it is rendered

Answer 1

您不希望准备好的功能签名中有$：

jQuery(document).ready( 
    function() 
    {         
        $('#codes').accordion(); 
    } 
);

你可能已经从插件源复制了这个模式，它通常用于确保插件使用来自jQuery的$而不是例如prototype - 你将你的插件声明为一个匿名函数，然后立即调用它传递一个jQuery对象。如果ready函数接受一个参数（我不确定它，但the docs建议它是一个常规绑定事件）它将是一个事件对象而不是一个jQuery对象。

Answer 2

许多JavaScript库使用$作为函数或变量名，就像jQuery一样。在jQuery的情况下，$只是jQuery的别名，因此所有功能都可以在不使用$的情况下使用。如果我们需要在jQuery旁边使用另一个JavaScript库，我们可以通过调用jQuery.noConflict（）来将$的控制权返回给另一个库;

见示例：

jQuery.noConflict();
(function($)
{
   $('#codes').accordion(); 
})
(jQuery);

jQuery UI Accordion不起作用

2 个答案: