Question

所以我在js中没那么好...我在dom中添加div后出现了问题，无法理解，以后如何使用它。

所以我有一个简单的代码，它添加了div。

$('#add_frame_by_button').click(function(){
        $('body').append(crazy_frame);
    });

也有

$("#resizable").draggable().resizable({
        resize: function(event, ui) {
            //some code
        }
    });

那么如何在添加后将其绑定到工作？

Answer 1

您可以在附加div并将事件绑定到div后尝试遍历div。

$('body').append(crazy_frame).children('#resizable').draggable()...

现在可能发生的是$("#resizable").draggable()...在您加载页面时绑定事件，但是您在页面加载后附加内容。

您也可以尝试使用带有选择器的jQuery on()来始终绑定事件，如果您使用的是1.7之前的jQuery，则可以尝试使用live() / delegate()。初始点击如何附加到对象没有问题，因此这是不相关的。

Answer 2

如你所说的那样绑定你的答案。您将click事件绑定到父元素，它将监视通过的任何点击事件。目前，您只在可用元素上设置click事件。

http://api.jquery.com/bind/

来自其网站的示例：

$('#foo').bind('click', function() {
  alert('User clicked on "foo."');
});

Answer 3

我认为您正在寻找jQuery的.on()功能。其他一些答案提到了.live()函数，但是从jQuery 1.7开始就不推荐使用这个函数。

.on()功能可让您侦听从子元素冒出的特定事件并进行适当的响应。如果将.on()方法应用于包含动态添加的<div>的元素，则可以定义一个函数，该函数将在特定事件从<div>内的任何时间起被调用。元件。

另外，您是否有理由不能在.resizable()处理程序本身中简单地应用各种.draggable()和.click()函数？

Answer 4

你的问题不是很清楚。

我认为这就是你要找的东西：

如果你想添加一个框架，你需要构建一个，所以你必须附加这个：

<div id='crazy_frame' style='width:200px;height:100px;background-color:red'></div>

我给出一些尺寸和颜色以便对我可见，当然你可以改变尺寸和颜色。

然后如果你想给这个'框架'提供一个可拖动的权利，你只需要调用可拖动的方法。

<script type="text/javascript">
$(document).ready(function(){
 $('#add_frame_by_button').click(function(){
  $('body').append("<div id='crazy_frame' style='width:200px;height:100px;background-      color:red'></div>");
  $('#crazy_frame').draggable();
 });    

});

</script>

如果你这样做，你将很快面临问题。告诉我，我是否有权遵循

添加后使用div

4 个答案: