How to redirect to a link once item is dropped using jQuery UI?

I have a menu

             <div id="nav">
     <ul>
        <li><a href="http://www.example.com"> Home </a></li>
        <li><a href="http://www.example.com"> About </a></li>
        <li><a href="http://www.example.com"> Contact </a></li>
      </ul>开发者_C百科;
                    </div>

and a drop zone

     <div id="dropzone">
     </div>

Once one of the list items is dropped in the dropzone it will then redirect to the link.I am using jQuery UI but I can't figure out how to do this can somebody help me out?

$(function(){
    $("#dropzone").droppable(
        {
          drop: function(event, ui){
          window.location.href = ui.draggable.find("a").attr("href");
        }
    });

    $("li").draggable();
});

See http://jsfiddle.net/PHU8C/

Use window.location.href = 'your_link_url';

You can try it like this

$( "#dropzone" ).droppable({
   drop: function(event, ui) { 
       window.location.href = 'http://yourlink.com/';
   }
});

I've never used either... but maybe you should look at the documentation? It seems pretty straightforward. There is a drop event that you can bind to. $(this) in the callback is the dropzone.

$( ".selector" ).droppable({
   drop: function(event, ui) { 
       window.location.href = $(this).attr("href");
   }
});