开发者

jQuery UI - Sortable isn't firing?

I'm trying to get the jQuery UI sortable plugin to work and I've created a list that looks like this:

<ul id="sortable">
    <li>Item 1</li>
    <li>Item 2</l开发者_运维百科i>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>

And I've included the plugin script files:

$(function() {
    $("#sortable").sortable();
    alert('test');
    $("#sortable").disableSelection();
});

So I just tried putting the alert box before .sortable is run and the alertbox is showing. But putting it after .sortable isn't working. Which means that .sortable is failing right?

I've included the scripts and put them in the head of the html document.

<script type="text/javascript" src="js/jquery.ui.core.min.js"></script>
<script type="text/javascript" src="js/jquery.ui.mouse.min.js"></script>
<script type="text/javascript" src="js/jquery.ui.sortable.min.js"></script>
<script type="text/javascript" src="js/jquery.ui.widget.min.js"></script> 

Which is correct right? And the function that actually runs .sortable is in a merged js file along with all other js snippets and plugins.


Make sure you're including the correct files in the correct order, a much easier approach would be to download the complete or partial, whatever you need, package from jQuery UI directly here: http://jqueryui.com/download

When you download you get a single minified js file (jquery-ui-1.8.1.custom.min with the current version) instead of individual scripts. If you have the cache headers set correctly, the client caches this once.


Alternatively, include the scripts directly from a CDN, for example here's google's copy:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>

Doing this should save you a lot of dependency headaches with the various widgets. Also note that Google hosts the themes as well if you're using a default one, see this question for a list, update the links from 1.7.2 to your version, e.g. 1.8.1 at the time of ths answer.


EDIT: Just checked your dependencies and the internal JQuery UI dependencies are fine but I do not see a reference to JQuery itself...do you have this in your master page or something?

<script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>

I don't see a problem with the code you gave but your references to the scripts are referencing a subfolder of the folder that your page is on...which is fine if your structure is like that.

Assuming that the js folder is off the root, try referencing relative to the root folder like this:

<script type="text/javascript" src="/js/jquery.ui.widget.min.js"></script>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜