Jump to content
php.lv forumi

Advancētāka drag & drop handlošana


Lynx

Recommended Posts

Tātad vienam ļoti dinamiskam projektam savedu kārtībā drag & drop. Bet problēma rodas ar to, ka ir nepieciešama sarežģītāka eventu handlošana un es nevaru izlemt par elegantāko risinājumu.

 

Tātad pašlaik, katram definētajam objektam, kuru ir iespējams dragot ir definēts mērķis uz kurieni jaizvelk. Tālāk mēs nosakam vai pele atlaišanas brīdi ir uzzvilkta uz mērķa objekta(cik saprotu šis ir labākais variants, jo dažos browseros, dragojamais attēls, piemēram, būtu priekšā mērķim un var rasties problēmas.)

var target = document.getElementById(_dragTarget);
var targPos = getPosition(target);

if((e.clientX > targPos.x)  && (e.clientX < (targPos.x + parseInt(target.offsetWidth)))  &&
(e.clientY > targPos.y) && (e.clientY < (targPos.y + parseInt(target.offsetHeight)))){
target.appendChild(_dragElement);

Ja ir robežās tad šo te dragojamo objektu appendojam kaa childu mērķim.

 

Un te rodas jautājums, vai ir iespējams ka target objekts, pēc tam kad viņam ir appendots childs pats izsauc funkciju? Onchange, cik es testēju darbojas tikai formas elementiem. Ar onclick, pēc literatūras ir problēmas ar IE(neesmu testējis, nav IE :D), un firefox cik testēju onclick paspēj izpildīties vēl pirms dragojamais elements ir appendots.

Teorētiski varētu šo jautājumu risināt arī pašā dragošanas kodā, bet tas nav īsti loģiski, jo ši funkcija atbild par dragošanu.

 

Bija ideja, ka target divam uzlikt to pašu onchange, kurš kā jau minēju man nedarbojas, lai nebojātu dom ar neeksistējošiem elementiem: <div onchange="izsaucamaa_funkcija();"></div>

Un pēc tam kad appendojam childu veikt pārbaudi

if(target.getAttribute('onchange')) { eval(target.getAttribute('onchange')); }

Bet šis īsti nešķiet elegants risinājums, jo izmanto eval... Jūsu domas?

Link to comment
Share on other sites

Tavā risinājumā varētu iztikt arī bez eval. Ar DOM metodēm piekabini elementam klāt DOM līmenī speciālu atribūtu (pareizāk sakot propertiju) ar anonīmo funkciju:

 

el.mans_specialais_onchange = function() {....}

 

Un tad tavs nodropotais elements tad lai arī izsauc šo funkciju (el.mans_specialais_onchange();).

Edited by andrisp
Link to comment
Share on other sites

×
×
  • Create New...