JS = Handle Click events coexist with drag events

With the Click event, it is difficult to determine when the drag starts and ends when it is triggered, so use onmouseup (when releasing the mouse), release the mouse when the drag is not finished, but ready to process the stage, at which point Mousebuttonflag should be true logically, That is, the bound event is not triggered.

1. Switch Click to use onmouseup Event

2. Add the Mousebuttonflag object to determine whether or not to drag and drop the event to trigger a mouse release (click)

(This is an article of the sortable parameter description , author xpsharp,http://blog.csdn.net/xpsharp/article/details/6906228)

What needs to be handled is that when you drag a picture, you can't trigger a click event

1 <ulclass= "Alist ui-sortable"ID= "Acalbums">2                                                             <!--Loading Albums -3                                                                 4                                                                 5                                                                 <Li>6                                                                     <Divclass= "Closed"></Div>7                                                                     <Divclass= "Media1">8                                                                         <ahref="#_">9                                                                             <imgsrc= "http://file.ttyouni.com/image/ cf195039ccf61be50eca6fad8beddd837a67e1876165d68ef16fb51385e0341bf7893184ab4034465ca6bbbe041be38bddb9d98c3453acc7799dcc324 8AA0A0C0F208BDE2F43C2284E2B28331912539C734556076D66B0BF "alt=""URL=""onmouseup= "Openimagesetdialog (this)"width= " the"></a>Ten                                                                     </Div> One                                                                 </Li><Listyle= "position:relative; left:0px; top:0px;"class=""> A                                                                     <Divclass= "Closed"></Div> -                                                                     <Divclass= "Media1"> -                                                                         <ahref="#_"> the                                                                             <imgsrc= "http://file.ttyouni.com/image/ cf195039ccf61be50eca6fad8beddd837a67e1876165d68ef16fb51385e0341bf7893184ab4034465ca6bbbe041be38bddb9d98c3453acc7799dcc324 8AA0A0C9474269A0C6F49FC58F17296CA8F10DD734556076D66B0BF "alt=""URL=""onmouseup= "Openimagesetdialog (this)"width= " the"></a> -                                                                     </Div> -                                                                 </Li><binstyle= "position:relative; left:0px; top:0px;"class=""> -                                                                     <Divclass= "Closed"></Div> +                                                                     <Divclass= "Media1"> -                                                                         <ahref="#_"> +                                                                             <imgsrc= "http://file.ttyouni.com/image/ cf195039ccf61be50eca6fad8beddd837a67e1876165d68ef16fb51385e0341bf7893184ab4034465ca6bbbe041be38bddb9d98c3453acc7799dcc324 8AA0A0C0F208BDE2F43C2284E2B28331912539C734556076D66B0BF "alt=""URL=""onmouseup= "Openimagesetdialog (this)"width= " the"></a> A                                                                     </Div> at                                                                 </Li><binstyle= "position:relative; left:0px; top:0px;"class=""> -                                                                     <Divclass= "Closed"></Div> -                                                                     <Divclass= "Media1"> -                                                                         <ahref="#_"> -                                                                             <imgsrc= "http://file.ttyouni.com/image/ cf195039ccf61be50eca6fad8beddd837a67e1876165d68ef16fb51385e0341bf7893184ab4034465ca6bbbe041be38bddb9d98c3453acc7799dcc324 8AA0A0C0F208BDE2F43C2284E2B28331912539C734556076D66B0BF "alt=""URL=""onmouseup= "Openimagesetdialog (this)"width= " the"></a> -                                                                     </Div> in                                                                 </Li> -                                                                 <Listyle= "position:relative; left:0px; top:0px;"class=""> to                                                                     <Divclass= "Closed"></Div> +                                                                     <Divclass= "Media1"> -                                                                         <ahref="#_"> the                                                                             <imgsrc= "/content/images/scene/gather204/banner.jpg"alt=""URL= "http://www.ttyouni.com/"onmouseup= "Openimagesetdialog (this)"width= " the"></a> *                                                                     </Div> $                                                                 </Li>Panax Notoginseng                                                                  -                                                                                                                         <Liclass= "Add"> the                                                                 <ahref= "javascript:;"> +                                                                     <imgsrc= "/content/images/scene/vote004/jia.jpg"onclick= "Openimagesetdialog (this,1)"width= " the"> A                                                                 </a> the                                                             </Li> +                                                         </ul>

HTML

Processing of JS

var Mousebuttonflag = false;//Controls whether to trigger click events//Drag $ (' #acAlbums '). Sort            Able ({items: "Li:not (. Add)", Start:function (event, UI) {Mousebuttonflag = true;            }, Stop:function (event, UI) {Mousebuttonflag = false;        }        });            Open the pop-up picture settings popup function Openimagesetdialog (obj,v) {if (Mousebuttonflag) {return; } if (v!=undefined) {//Add Picture Object $ ("#show_image_1"). attr ("src", "/content/images/scene/vote004                /jia.jpg "); $ ("#image_url_txt"). Val ("Http://ttyouni.com/show/index")} else {$ ("#show_image_1").                attr ("src", $ (obj). attr ("src")); $ ("#image_url_txt"). Val ($ (obj). attr ("url"))} $ ("#image_index_txt"). Val ($ (obj). Parents ("#acAlbums Li        "). Index ()) $ (" #choose_activebox1 "). Show (); }

JS = Handle Click events coexist with drag events