Question

我是html和java脚本的新手，试图在页面加载完成时触发点击事件

$(document).ready(function(event){
    $("#london").click(function(event){
       openCity(event,'London');
    });

    $("#london").trigger('click'); //this is automatic click

});

此点击正在运行。但在我的功能中

function openCity(evt, cityName) {
   var id = evt.toElement.id; //id is undefined only when click event triggered
}

id仅在触发click事件时未定义，正常时单击它包含值。

Answer 1

而不是 toElement ，您需要使用目标。

有关详细信息，建议您阅读What is the difference between Event.target, Event.toElement and Event.srcElement?

function openCity(evt, cityName) {
  var id = evt.target.id; //id is undefined only when click event triggered
  console.log('id: ' + id);
}

 $("#london").click(function(event){
    openCity(event,'London');
});

$("#london").trigger('click'); //this is automatic click

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

Answer 2

使用evt.target.id代替toElement - 请参阅下面的演示：

$(document).ready(function(event) {
  $("#london").click(function(event) {
    openCity(event, 'London');
  });

  $("#london").trigger('click'); //this is automatic click

});

function openCity(evt, cityName) {
  var id = evt.target.id; 
  console.log(id);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='london'>London</div>

Answer 3

您可以使用this关键字作为您的功能，如下所示。

＆＃13;

function openCity(element, cityName) {
  var id = element.id; 
  console.log('id: ' + id);
}

$("#london").click(function(event){
    openCity(this,'London');
});

$("#london").trigger('click'); //this is automatic click

＆＃13;

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

＆＃13;

Answer 4

您最好在函数内部使用this，然后使用attr('id')获取相关属性：

function openCity(el, cityName) {
   var id = $(el).attr('id');
   console.log(id);
}

$(document).ready(function(event){
    $("#london").click(function(event) {
       openCity(this, 'London');
    });

    $("#london").trigger('click'); //this is automatic click
});

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

您上下文中的

this是点击的相关元素。

Answer 5

使用DigitsOnlyEE获取绑定元素。

function openCity(evt, cityName) {
   var id = evt.currentTarget.id;
}

这是event对象的标准属性。它产生与处理程序中this相同的值。这样，您仍然可以绕过event对象并获得target，currentTarget以及所有其他事件数据。

请注意，target和currentTarget可能是两个不同的元素。 target是最常嵌套的元素，而currentTarget始终是绑定元素。

由于您希望元素具有id，因此使用currentTarget会更安全。对于.trigger()调用无关紧要，但如果您有嵌套元素，可能会针对实际的人工点击。

触发事件单击时，event.toElement.id始终未定义

5 个答案: