Question

两个程序：

-one有一个可拖动的div，里面有一个iframe。

<head>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />

<script>
$(function() {
    $( "#draggable" ).draggable();
});
</script>

<style>
#draggable { width: 1500px; height: 300px; }
</style>

</head>

<body>
    <div id="draggable" class="ui-widget-content" style="background:#ccc">
        <p>Drag me around</p>
        <iframe src="test.php" style="background:#eee;width:100%;height:240px;" frameborder='0' ></iframe>
    </div>
</body>

- 另一个是iframe程序

<body>
<div onclick="alert('Clicked here')">Just a test with an input</div>
<input type="text" id="txtid">
</body>

场景：我点击div内的鼠标按钮开始拖动，然后快速将鼠标从div拖到iframe内部。我失去了可拖动的能力（好吧，我可以离开这个）。但是，我释放了鼠标按钮并将其移出iframe ...一旦鼠标触摸div 重复：没有按下鼠标按钮，拖动仍然有效

这是拖拽方法的错误或功能？如何强制停止拖动行为？如果你试试，你会发现这是一种非常讨厌的行为。

TIA，

Answer 1

可能是iframe上的任何鼠标事件都没有冒泡到父文档。基本上，当您释放鼠标按钮时，该事件永远不会回到可拖动的处理程序 - 它无法知道您没有按下鼠标按钮。

您可以使用可拖动的“帮助程序”选项在拖动时用占位符div替换iframe - 或者，您可以在拖动时用透明覆盖覆盖iframe。

需要一些想法以避免可拖动的jqueryui问题

1 个答案: