PhoneGap應用程序 - 拖放在android中作爲通過jquery移動

Question

嗨，大家好，我正在通過jquery mobile在android中拖放事件。我測試了瀏覽器上的代碼工作正常，但沒有在設備上。任何人都可以幫我解決這個問題。我下面鏈接的第一個教程....

http://www.elated.com/articles/drag-and-drop-with-jquery-your-essential-guide/ 

Answer 1

這是我的劇本我已經做Emrullah ...

<script type="text/javascript"> 
    $(document).ready(function() { 
    $(init); 
    function init() { 
    document.addEventListener("touchstart", touchHandler, true); 
    document.addEventListener("touchmove", touchHandler, true); 
    document.addEventListener("touchend", touchHandler, true); 
    document.addEventListener("touchcancel", touchHandler, true); 
    } 
    $(function(){ 
    $(".drag") 
    .bind("dragstart", function(event){ 
    // ref the "dragged" element, make a copy 
    var $drag = $(this), $proxy = $drag.clone(); 
    // modify the "dragged" source element 
    $drag.addClass("outline"); 
    // insert and return the "proxy" element  
    return $proxy.appendTo(document.body).addClass("ghost"); 
    }) 
    .bind("drag", function(event){ 
    // update the "proxy" element position 
    $(event.dragProxy).css({ 
    left: event.offsetX, 
    top: event.offsetY 
    }); 
    }) 
    .bind("dragend", function(event){ 
    // remove the "proxy" element 
$(event.dragProxy).fadeOut("normal", function(){ 
$(this).remove(); 
}); 
// if there is no drop AND the target was previously dropped 
if (!event.dropTarget && $(this).parent().is(".drop")){ 
// output details of the action 
$('#log').append('<div>Removed <b>'+ this.title +'</b> from <b>'+ 
    this.parentNode.title +'</b></div>'); 
// put it in it's original <div> 
$('#nodrop').append(this); 
    } 
// restore to a normal state 
    $(this).removeClass("outline"); 
    }); 
    $('.drop') 
.bind("dropstart", function(event){ 
// don't drop in itself 
if (this == event.dragTarget.parentNode) return false; 
// activate the "drop" target element 
$(this).addClass("active"); 
}) 
.bind("drop", function(event){ 
// if there was a drop, move some data... 
$(this).append(event.dragTarget); 
// output details of the action... 
$('#log').append('<div>Dropped <b>'+ event.dragTarget.title +'</b> into <b>'+ 
    this.title +'</b></div>'); 
}) 
.bind("dropend", function(event){ 
// deactivate the "drop" target element 
$(this).removeClass("active"); 
    }); 
}); 
    function touchHandler(event) 
    { 
    var touches = event.changedTouches, 
    first = touches[0], 
    type = ""; 
    switch(event.type) 
    { 
    case "touchstart": type = "mousedown"; break; 
    case "touchmove": type="mousemove"; break;   
    case "touchend": type="mouseup"; break; 
    default: return; 
    } 
    var simulatedEvent = document.createEvent("MouseEvent"); 
    simulatedEvent.initMouseEvent(type, true, true, window, 1, 
     first.screenX, first.screenY, 
      first.clientX, first.clientY, false, 
       false, false, false, 0/*left*/, null); 
    first.target.dispatchEvent(simulatedEvent); 
    event.preventDefault(); 
    return; 
    } 
    }); 
    </script> 

Answer 2

的問題可以是下列條件之一：1 設備必須具有互聯網連接 2 - 您使用的文件不在「jQuery Mobile的」。他們只是用來開發網頁的jquery文件。 3-如果您在平板電腦上使用該應用程序，我想您的應用程序可以通過平板電腦的鼠標工作。但它不能通過觸摸工作。

這些是我能猜到的問題。我希望你找到確切的解決方案。如果你找到它，請在這裏發表對我來說:)

Answer 3

你的代碼看起來很好，你說，它已在瀏覽器成功運行。我認爲問題可能是您使用的jquery文件。如果您鏈接了駐留在網站上的jquery文件，請確保您的設備具有互聯網連接。如果沒有互聯網連接，請下載並將「jquery mobile」文件放入assest/www文件夾並鏈接文件。

難道你沒有在模擬器上運行應用程序嗎？你遇到什麼錯誤？