2014-09-03 24 views
1

我可以拖動和圖像拖放到一個星期誰吃一次東西,如果增加誰吃五倍以上

一個人吃的食物的籃子超過每週五次的分數,否則他永遠不會吃項目?

例如,如果誰吃了西瓜,每週一次的人,試圖通過30

拖動並從項目釋放西瓜圖像籃子點增加如果誰吃西瓜一樣五句每週一次,如何提高他的分數?

這裏是一個腳本

var myscore=0; 
function dragStart(ev) { 
    ev.dataTransfer.effectAllowed='move'; 
    ev.dataTransfer.setData("Text", ev.target.getAttribute('id')); 
    ev.dataTransfer.setDragImage(ev.target,0,0); 
    return true; 
} 
function dragEnter(ev) { 
    event.preventDefault(); 
    return true; 
} 
function dragOver(ev) { 
    return false; 
} 
function dragDrop1(ev) { 
    var src = ev.dataTransfer.getData("Text"); 
    if(!ev.target.contains(document.getElementById(src))){ 
    ev.target.appendChild(document.getElementById(src)); 
    ev.stopPropagation(); 
    var cal=0; 
    switch(src){ 
     case "image1": cal = 20; break; 
     case "image2": cal = 30; break; 
     case "image3": cal = 40; break; 
     case "image4": cal = 50; break; 
     case "image5": cal = 60; break; 
     default: cal=10; 
    } 
    myscore=myscore-cal; 
    document.getElementById('Score').innerHTML=myscore; 
    } 
    return true; 
} 
function dragDrop2(ev) { 
    var src = ev.dataTransfer.getData("Text"); 
    if(!ev.target.contains(document.getElementById(src))){ 
    ev.target.appendChild(document.getElementById(src)); 
    ev.stopPropagation(); 
    var cal=0; 
    switch(src){ 
     case "image1": cal = 20; break; 
     case "image2": cal = 30; break; 
     case "image3": cal = 40; break; 
     case "image4": cal = 50; break; 
     case "image5": cal = 60; break; 
     default: cal=10; 
    } 
    myscore=myscore+cal; 
    document.getElementById('Score').innerHTML=myscore; 
    } 
    return true; 
} 

這裏是一個Fiddle

+0

這是一個非常好的辦法把這個問題。 – 2014-09-03 17:00:49

回答

1

好這裏的交易。我添加了一個功能來複制食物分區,因此可以隨意拖放多次。

function duplicate(x) { 
    var clone = x.cloneNode(true); 
    clone.id = "" 
    clone.onclick = duplicate; 
    x.parentNode.insertBefore(clone, x.nextSibling); 
} 

這是一個fiddle

這樣,只要你想,你可以把儘可能多的西瓜。問題是你可以通過點擊它們來乘以內部的物品。我沒有足夠的時間來修正錯誤,但它是你可以考慮在自己的現在。當我有時間時,我會清理腳本。

PS:我改變了IDS上課,乘法的目的。

+0

這裏是[改進版](http://jsfiddle.net/sj0ssp68/5/)。 – 2014-09-04 11:00:47

+0

謝謝你的改進版,我不能渡過這個錯誤 - 但有一個小bug-般如果我拖放從項目列表中的圖片到項目列表,圖像消失,如果我拖將圖像從籃子列表中拖放到籃子列表中的圖像上,出現更多圖像。在初始值之後拖放的分數也有10分的波動。例如,如果將拖放圖像從項目列表到項目列表沒有什麼變化應該發生,如果我把圖像從籃子拖放到籃子不應該發生變化 – James 2014-09-09 02:49:32

+0

@詹姆斯是更好[現在](http://jsfiddle.net/sj0ssp68/6/ )?您只需保存字段的原點,並檢查它是否仍在同一個框中;) – 2014-09-09 11:18:25