我在 Mac OS X 10.8.5 上使用 Chrome(版本 30.0.1599.101)在演示模式下使用启用触摸屏的电视,突然间我的 div 变得可拖动。我们没有通过 jquery 或 HTML5 规范启用拖放功能,但不知何故,我们能够拖动我们的 div 并将它们放置在屏幕上的任何位置。我们可以旋转和调整它们的大小。当我们刷新页面时,这个功能就停止了。任何想法这是怎么可能的?
我们之前从开发工具中启用了“模拟触摸事件”,但是当这个功能出现时,开发工具没有打开。此外,我们已经安装然后卸载了 Chrome MuliTouch 扩展程序。
编辑
页面 HTML:
<!DOCTYPE html>
<html>
<head>
<meta content='width=device-width, initial-scale=1.0' name='viewport'>
<title>ArcSite Demonstration</title>
<meta content='Arcsite' name='description'>
<link href="/assets/jquery.ui.core.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.theme.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.accordion.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.menu.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.autocomplete.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.button.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.datepicker.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.resizable.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.dialog.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.progressbar.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.selectable.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.slider.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.spinner.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.tabs.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.tooltip.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.base.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery.ui.all.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jqplot.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/open_layers/style.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/a_maps_layout.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/alerts.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/bootstrap_and_overrides.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/companies.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/factory_details.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/home.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/jquery-ui-timepicker-addon.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/locations.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/tags.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/tracked_points.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/workers.css?body=1" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-transition.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-affix.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-alert.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-button.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-carousel.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-collapse.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-dropdown.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-modal.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-scrollspy.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-tab.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-tooltip.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-popover.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap-typeahead.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap.js?body=1" type="text/javascript"></script>
<script src="/assets/openlayers/OpenLayers.js?body=1" type="text/javascript"></script>
<script src="/assets/openlayers-rails.js?body=1" type="text/javascript"></script>
<script src="/assets/unity/UnityObject2.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.core.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.widget.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.accordion.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.position.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.menu.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.autocomplete.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.button.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.datepicker.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.mouse.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.draggable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.resizable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.dialog.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.droppable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-blind.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-bounce.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-clip.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-drop.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-explode.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-fade.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-fold.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-highlight.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-pulsate.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-scale.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-shake.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-slide.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-transfer.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.progressbar.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.selectable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.slider.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.sortable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.spinner.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.tabs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.tooltip.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.all.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-ui-timepicker-addon.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/index.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/jquery.jqplot.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/excanvas.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/plugins/pieRenderer.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/plugins/barRenderer.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/plugins/categoryAxisRenderer.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/plugins/canvasAxisLabelRenderer.js?body=1" type="text/javascript"></script>
<script src="/assets/jqplot/plugins/canvasTextRenderer.js?body=1" type="text/javascript"></script>
<script src="/assets/private_pub.js?body=1" type="text/javascript"></script>
<script src="/assets/alerts.js?body=1" type="text/javascript"></script>
<script src="/assets/companies.js?body=1" type="text/javascript"></script>
<script src="/assets/factories.js?body=1" type="text/javascript"></script>
<script src="/assets/home.js?body=1" type="text/javascript"></script>
<script src="/assets/hr_dept.js?body=1" type="text/javascript"></script>
<script src="/assets/location_import.js?body=1" type="text/javascript"></script>
<script src="/assets/locations.js?body=1" type="text/javascript"></script>
<script src="/assets/tags.js?body=1" type="text/javascript"></script>
<script src="/assets/tracked_points.js?body=1" type="text/javascript"></script>
<script src="/assets/workers.js?body=1" type="text/javascript"></script>
<script src="/assets/zones.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="vjtlRmIWqfBpHsTVEXKo85CwMsnzVJWmk3KBAg0WNRw=" name="csrf-token" />
</meta>
</meta>
</head>
<body class='home model'>
<div class='navbar navbar-fixed-top'>
<nav class='navbar-inner'>
<div class='container'>
<a href="/home/model" class="brand">Arcsite</a>
<ul class='nav'>
<li><a href="/companies">Companies</a></li>
<li><a href="/workers">Workers</a></li>
<li><a href="/locations">Locations</a></li>
<li><a href="/certificates">Certificates</a></li>
<li><a href="/tags">Tags</a></li>
<li>
<a href="/users/sign_out" data-method="delete" rel="nofollow">Logout</a>
</li>
<li>
<a href="/users/edit">Edit account</a>
</li>
</ul>
</div>
</nav>
</div>
<div id='main' role='main'>
<div class='container'>
<div id='demo_page_header'></div>
<div class='content'>
<div class='row'>
<div class='span12'>
<div class='row'>
<div class='span' dispay='none' id='demo_flag'></div>
<div class='span12'>
<script type="text/javascript">PrivatePub.sign({"server":"http://localhost:9292/faye/faye","timestamp":1383923315163,"channel":"/tracked_points/new","signature":"d50b7a8ef6ee1a3e65a1c6835f88c173b15cca2a"});</script>
<script type="text/javascript">PrivatePub.sign({"server":"http://localhost:9292/faye/faye","timestamp":1383923315163,"channel":"/tracked_points/group","signature":"d0f6e25ed08577bdcafbe2b5c36deff8fcb488d5"});</script>
</div>
</div>
<div class='row'>
<div class='span9'>
<div class='box' id='tabs-1'>
<div id='zoom_to_extent'>
<img alt="Reset-icon" src="/assets/reset-icon.png" />
</div>
<!-- /#replay_mode{ replay: 'off'} -->
<!-- / replay mode -->
</div>
</div>
<div class='span3'>
<div class='demo-long-container'>
<div class='demo-widget-label'>
<h3>
<div id='muster_list_label'>
Muster List
</div>
</h3>
</div>
<div class='demo-list-container'>
<div id='chkbox'>
<input id="ml_sort_by_company" name="ml_sort_by_company" type="checkbox" value="1" />
Sort by Company
</div>
<div id='muster_list'></div>
</div>
</div>
</div>
</div>
<div class='row'>
<div class='span3'>
<div class='demo-widget-container'>
<div class='demo-widget-label'>
<h3>Asset Profile</h3>
</div>
<div id='demo_info_box'></div>
</div>
</div>
<div class='span3'>
<div class='demo-widget-container'>
<div class='demo-widget-label'>
<h3>Widget 2</h3>
</div>
<div id='demo_info_box2'></div>
</div>
</div>
<div class='span3'>
<div class='demo-widget-container'>
<div class='demo-widget-label'>
<h3>Zone Analytics</h3>
</div>
<div id='demo_info_box3'>
<div id='time_in_zones_pie_chart'></div>
</div>
</div>
</div>
<div class='span3'>
<div class='demo-widget-container'>
<div class='demo-widget-label'>
<h3>Your Current Location</h3>
</div>
<div id='user_current_location'></div>
</div>
</div>
</div>
</div>
</div>
<footer></footer>
</div>
</div>
<!-- ! end of .container -->
</div>
<!-- ! end of #main -->
</body>
</html>