Question

考虑这一行：

<div onload='getContent();'></div>

我有以下JS功能：

function getContent() {
  $.ajax({
    url: '/ContentController.php',
    success: function(data) {
    //change the html of the element this was called on, "TARGET"
      $(TARGET).html(data);
    }
  });
}

我想在不使用ID的情况下选择调用函数的元素，例如，如果返回为“Hello World”的数据，则上面的html将如下所示：

<div onload='getContent();'>Hello World</div>

有办法做到这一点吗？

Answer 1

给getContent一个参数并传递this作为其值。

HTML：

<div onload='getContent(this);'></div>

JS：

function getContent(element) {
  $.ajax({
    url: '/ContentController.php',
    success: function(data) {
    //change the html of the element this was called on, "TARGET"
      $(element).html(data);
    }
  });
}

Answer 2

您不能将onload事件处理程序添加到div。它受少数标记支持 <body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>，<style>。

方法是添加内联脚本

<div onload='getContent(event);'>Hello world
<script>

  $.ajax({
    url: '/ContentController.php',
    success: function(data) {
    //change the html of the element this was called on, "TARGET"
      $('div[onload]').text();
    }
  });
</script>

</div>

Answer 3

有一种方法可以触发所有div的onLoad：

   function getContent(element) {
  $.ajax({
    url: '/ContentController.php',
    success: function(data) {
    //change the html of the element this was called on, "TARGET"
      $(element).html(data);
    }
  });
}

然后您可以触发div onLoad，就像您可以在window.load

中调用它一样

 $('div[onload]').trigger('onload');

和div elem：

<div onload='getContent(this);'>

目标元素JS被调用（没有ID）

3 个答案: