0

您好，我想弄清楚如何在这里为我的手机拖动此代码我已经包含了触摸打孔库，但是当我尝试在手机上拖动任何东西时它不起作用有谁知道我做错了什么？这是我试图拖动的代码

https://jsfiddle.net/elchininet/2u5xtkv2/

我的图书馆是

<meta name="viewport" content="width=device-width, initial-scale=1">

<meta charset = "utf-8">

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

<link rel="stylesheet" href="styles/styles.css">

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
                <script src="jquery.ui.touch-punch.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
//---Vars
var slices = $("#slices");
var options = $("#options");
var area = $("#area");

var selected;
var result;

//---Array of images
var pizzas = [
    {image: "http://s23.postimg.org/6yojml8vb/Pizza_One.png", value: 1},
  {image: "http://s13.postimg.org/5d8zxnb2b/pizzatwo.png", value: 2},
  {image: "http://s12.postimg.org/xfsxldqyx/pizzathree.png", value: 3},
  {image: "http://s14.postimg.org/d6tdq0865/pizzafour.png", value: 4}
];
var total = pizzas.length;

//---Make boxes dragables
options.find("div").draggable();

//---When the boxes are dropped
area.droppable({

    drop: function(event, ui){

    if( Number( ui.draggable.attr("data-index") ) == result ){

        alert("correct");

    }else{

        alert("incorrect");

    }

  }

});

//---Insert random pizza slices
function insertPizzas(){

    selected = [];
  result = 0;

  //---Generate aleatory pieces
  var rand

  while(selected.length < 2){

        //---Random value
    rand = Math.floor( Math.random() * total );

    //---Sum result
    result += pizzas[rand].value;

    selected.push( rand );

  }

    //---Clear the slices
    slices.html("");

  //---Add the new slices
  selected.forEach(function(number){

    var img = $("<img/>");

    img.attr("src", pizzas[number].image);

    slices.append(img);

  });

}

insertPizzas();

感谢您的任何帮助

4

1 回答 1

1

您包含的脚本顺序错误，或者 touchpunch 所在的路径可能存在问题。用cdn试试这个。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>
于 2016-05-24T15:28:39.760 回答