selectable.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>selectable.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css" mce_href="styles.css">--> <mce:script type="text/javascript" src="../../jquery-1.4.4.min.js" mce_src="jquery-1.4.4.min.js"></mce:script> <mce:script type="text/javascript" src="../../jquery-ui-1.8.9.custom.min.js" mce_src="jquery-ui-1.8.9.custom.min.js"></mce:script> <mce:style><!-- /**这两个样式不应该被省区*/ #selectable .ui-selecting { background: blue; } /*正在选择中的项目的颜色*/ #selectable .ui-selected { background: #F39814; color: red; } /*被选中的项目的颜色*/ --></mce:style><style mce_bogus="1"> /**这两个样式不应该被省区*/ #selectable .ui-selecting { background: blue; } /*正在选择中的项目的颜色*/ #selectable .ui-selected { background: #F39814; color: red; } /*被选中的项目的颜色*/ </style> </head> <body> This is my HTML page. <br> <!-- 下面的标记是必须的 --> <ol id="selectable"> <li>自动编号?</li> <li>有趣</li> <li>3</li> <li>4</li> </ol> <mce:script type="text/javascript"><!-- $(function(){ $("#selectable").selectable(); }); // --></mce:script> </body> </html>