Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/macos/10.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html Chrome拖放div_Html_Macos_Google Chrome_Drag And Drop - Fatal编程技术网

Html Chrome拖放div

Html Chrome拖放div,html,macos,google-chrome,drag-and-drop,Html,Macos,Google Chrome,Drag And Drop,我当时正在Mac OS X 10.8.5上玩Chrome(30.0.1599.101版),在演示模式下使用触摸屏电视,突然我的div变成了可拖动的。我们没有通过jquery或HTML5规范启用拖放功能,但不知何故,我们能够将div拖动到屏幕上的任何位置。我们可以旋转并调整它们的大小。当我们刷新页面时,此功能停止。你知道这是怎么可能的吗 我们之前已经从开发工具中启用了“模拟触摸事件”,但是当这个功能显示出来时,开发工具并没有打开。此外,我们安装了Chrome MuliTouch扩展,然后卸载了它

我当时正在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>

弧点演示

PrivatePub.sign({“服务器”:”http://localhost:9292/faye/faye“,“时间戳”:1383923315163,“频道”:“/跟踪点/新”,“签名”:“d50b7a8ef6ee1a3e65a1c6835f88c173b15cca2a”});
PrivatePub.sign({“服务器”:”http://localhost:9292/faye/faye“,“时间戳”:1383923315163,“通道”:“/跟踪点/组”,“签名”:“D0F6E25ED08577BDCAFBE2B36DEFF8FCB488D5”});
集合名单
按公司分类
资产概况
小部件2
区域分析
您的当前位置

这是触摸事件模式下的默认浏览器行为。 如果您不需要任何拖放功能,只需将其关闭:

document.addEventListener('touchstart',函数(事件){e.preventDefault()},true)


关闭触摸事件模式。因为点击在触摸事件“阶段”后仍然有效:

谢谢您提供的信息,但我们实际上希望启用而不是禁用此功能。如何启用触摸事件模式?
我们之前已经从开发工具启用了“模拟触摸事件”
这是“触摸事件模式”。你能添加代码示例吗?这并没有把它带回来,但是花时间回答的话,就拿赏金来说吧。谢谢,我认为那是不可能的。无论如何,你能分享发生这种情况的页面吗?