Question

我知道我们可以将事件绑定到动态创建的元素，如下面的

$('some').on('click','class/id of dynamic ele',function(){});

但如何在动态创建的元素上触发click事件，就像我在dom中创建了新元素

<div class="one">M</div>

现在我怎么能$( ".one" ).trigger( "click" );？

Answer 1

$(document).on('click', '.one', function() {

使用这个来点击动态创建的元素

找到DOCUMENTATION了解更多信息

Answer 2

但是如何在动态创建的元素上触发click事件，比如i 在dom中创建了新元素

尝试定义没有属性<div class="one">M</div>的{{1}};使用<div">M</div>

在jQuery( html, attributes )的第二个参数设置attributes

.click()

<强> HTML

类型：htmlString定义a的字符串   单个，独立，HTML元素（例如或）。

<强>属性

类型：PlainObject属性，事件和的对象   调用新创建的元素的方法。

重要：如果传递了第二个参数， 第一个参数中的HTML字符串必须代表一个没有属性的简单元素。 从jQuery 1.4开始， 可以在 中传递任何事件类型，并且可以调用以下jQuery方法：val，css，html，text ，数据，宽度，高度或偏移量。

jQuery( html, attributes )

// create dynamic element
$( "<div></div>", {
  "class": "one",
  "text": "abc",
  "on": {
    // attach `click` event to dynamically created element
    "click": function( event ) {
      // Do something
      console.log(event.target, this.textContent)
    }
  }
}).appendTo( "body" )
// trigger `click` event on dynamically created element
.click()

Answer 3

将该元素存储在变量中，使用相同的元素在体内动态追加，然后触发点击它：

var div = "<div class='one'>M</div>";
$("body").append($(div));
//Your code//
$(div).trigger("click");

或者如果有多个元素具有相同的类，那么这是最后一个元素：

$(".one:last").trigger("click");

Answer 4

烨。 .trigger() 应该：

<强> 段：

＆＃13;

var myDIV = $('<div id="myDIV">&nbsp;</div>');
$(document.body).append(myDIV);
$(document).on('click', '#myDIV', onClick);
function onClick() {
  alert('hello');
}
myDIV.trigger('click');

＆＃13;

div {
  background-color: #cc0;
  width: 100px;
  height: 100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

＆＃13;

但话又说回来，如果在document准备就绪或加载了window时你想要这样做，那么你可能不需要.trigger() ，你可以直接调用这个函数。

Answer 5

我发布这个答案就像在所有答案中一样，我看不出把这个触发方法放在哪里。

如果你有jquery的.append(), .html()或普通j的.innerHTML, .appendChild()之后的任何实现，那么在执行它之后，或者我会说你在DOM中追加你的元素时，你可以使用它任何要触发的事件但必须绑定一些事件。

因此，元素必须在DOM中才能触发/触发任何事件。

举个例子：

var div = $('<div id="aaa">aaa</div>');
$(document.body).append(div).on('click', '#aaa', divClik);

function divClik(e) {
  alert(this.id+' clicked.');
}
div.trigger('click');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 6

由于没有提供FIDDLE，我假设了以下标记

<a class="some">Click To Add</a>
<br/>
<div class="container">
</div>

css class

.one
{
    background-color: Grey;
}
.some
{
     background-color: Red;
}

在控件添加到DIV（带容器类）后分配click事件

$(document).ready(function(){
    $('.some').click(function(){
        $('.container').append("<div class='one'>M</div><br/>");
        $('.container div').off('click').on('click',function(){
                alert("Clicked");
        });
    });
});

尝试FIDDLE，并分享您的输入。

希望这有助于............

Answer 7

你有没有试过委托？如果没有，你会尝试这样的动态添加内容。

$('body').delegate("div.one", "click", function(e){
   // do you other works here
});

检查此here

希望你的问题得到解决。：）

如何触发单击动态创建的元素

7 个答案: