0

我不断尝试制作一个可拖动的文本框,并且文本框总是返回到它开始的位置。我希望文本框是可点击和可拖动的,一旦它被放下它就会留下来。

这是我目前正在使用的代码。需要帮忙!

<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
#boxA{
float:left;padding:10px;margin:10px; -moz-user-select:none;
}
   #boxA { background-color: #6633FF; width:75px; height:75px;  }
</style>
<script type="text/javascript">
function dragStart(ev) {
   ev.dataTransfer.effectAllowed='move';
   ev.dataTransfer.setData("Text", ev.target.getAttribute('id'));
   ev.dataTransfer.setDragImage(ev.target,0,0);
   return false;
}
</script>
</head>
<body>
<center>
<div id="boxA" draggable="true" 
        ondragstart="return dragStart(event)">
   <p>Test</p>
</div>
</center>
</body>
</html>

你可以帮帮我吗?你能把更正的代码发给我吗?

4

1 回答 1

0

甚至比 jQuery resize() 更好,这在反射上可能并不完全合适,jQuery UI 在他们的网站上有一个可拖动的文本框示例:

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Draggable - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <style>
  #draggable { width: 150px; height: 150px; padding: 0.5em; }
  </style>
  <script>
  $(function() {
    $( "#draggable" ).draggable();
  });
  </script>
</head>
<body>

<div id="draggable" class="ui-widget-content">
  <p>Drag me around</p>
</div>


</body>
</html>

http://jqueryui.com/draggable/ - 在那里预览。

于 2013-05-15T23:55:44.410 回答