11-禁止通过点击来选择元素

11.5.3　禁止通过点击来选择元素

在默认情况下，只需点击即可选择或取消选择元素。我们可以禁止通过点击来选择元素，此时用户只能通过画矩形选框来选择。要做到这一点，将 distance 选项的值设为大于0即可：

<script src = jquery.js></script> 
<script src = jqueryui/js/jquery-ui-1.8.16.custom.min.js></script> 
<link rel=stylesheet type=text/css 
　　　 href=jqueryui/css/smoothness/jquery-ui-1.8.16.custom.css /> 
<style type=text/css> 
　p.ui-selecting { 
　　color : red; 
　} 
　p.ui-selected { 
　　background-color : gainsboro; 
　} 
</style> 
<div id=div1> 
　<p> Paragraph 1 </p> 
　<p> Paragraph 2 </p> 
　<p> Paragraph 3 </p> 
　<p> Paragraph 4 </p> 
　<p> Paragraph 5 </p> 
</div> 
<script> 
$("#div1").selectable ({　
　 distance : 1 
}); 
</script> 

现在只能在外层的 <div> 元素范围内拖动鼠标来框选段落（至少移动1个像素），而不能再使用单击来选择了。要还原点击选择功能，则需将 options.distance 设回0。