0

我是 jquery 的新手。我正在尝试使用 jquery 拖动和调整文本框的大小。但我面临一些问题。我可以拖动并重新调整文本框的大小。但是..只要看看下面的截图。 在此处输入图像描述

要拖动文本框，首先我必须将“边缘”（显示在箭头标记中）拖出框。总而言之，这不是一个好主意。那么有人可以帮我简单地拖动文本框吗？

下面是我的代码

    <html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Draggable - Constrain movement</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>
  #containment-wrapper { width: 300px; height:300px; border:2px solid #ccc; padding: 10px; }
  #custombox { width: 160px; height: 30px; padding: 0.5em; float: left; }
</style>

<script>
  $(function() 
  {    
    $("#custombox").draggable({ containment: "#containment-wrapper", scroll: false }).resizable(); 
  });
</script>

<body>

<div id="containment-wrapper">
  <div id="custombox" >
    <textarea></textarea> </p>
  </div>
</div>
</body>

</html>

当我在 jsfiddle.net 中尝试代码时，文本框是不可拖动的。只能调整大小。但我将代码复制到记事本并在 chrome 上运行。然后出现了截图中的问题。将文本框的边缘拖动到外部后，可以将框拖动到容器中的任何位置。

4

1 回答 1

1

Check this 

 $(function() 
  {    
    $("#custombox").draggable({  scroll: false }).resizable(); 
  });

Fiddle

于 2013-11-01T07:05:36.940 回答