Jquery:获取 html 元素的 id:为什么一个解决方案有效而另一个没有

丹·罗慕路斯

我在最初隐藏的索引页面上引用一个元素,然后在 index.html 页面上用 jquery 显示。无法解释为什么第一个不起作用,即使它应该起作用,但最后一个起作用。我得到一个按下按钮的 id “id='edit1'...2...3..etc” 谢谢!

//why this doesn't work and the next one does???
/*$('.edit-btn').click(function(){
 var id = $(this).attr('id');
 console.log("btn1:", id);
 });

$('.edit-btn').on('click', function(){
 var id = $(this).attr('id');
 console.log("btn1:", id);
 });
 */

var id;
$("body").on("click",".edit-btn",function(){
id = (this.id).replace("edit","");

更新:

使用此函数隐藏和显示容器:

function hideWindowsAndShowOneWindow(sWindowId) {
$('.wdw').hide(); //fadeout 500
$('#' + sWindowId).show(); // fade in 500
}

所以我试图通过 id 引用的 div 容器在页面加载后或可能在页面加载之前被隐藏。我的猜测是在页面加载后...

HTML:

<div class="wdw" id="wdw-events">

<h4>Events text</h4></br>
   <div id="content"></div>
    <h4>Edit Events</h4></br>
    <div>

</div>

它是在用这个 js 脚本加载页面后添加/注入的,但最后一个方法仍然有特殊之处,只是通过文档向下引用按钮的 id 属性:

  finalEventsLS.forEach(function (item) {
    var date = item.date.day + "/" +item.date.month + "/" + item.date.year;
    $('#content').append("<ul><li>" +
      "Event nr.: " + item.id + "   " +
      "Name: " + item.name + "   " +
      "Topic: "+ item.topic + "   " +
      "Speaker: "+ item.speaker + "   " +
      "Date: " + date + "&emsp;" +
      "</li><button class='edit-btn' id='edit" + item.id + "'>Edit</button>
   </ul>");

  })
亚伦·伊夫莱斯

很难说,因为你只分享了你的 jQuery。请用您的 HTML 更新。

如果您正在引用在初始页面加载后添加到 DOM 的元素,.click则不会起作用,因为它只查找最初加载到 DOM 中的元素。相反,您将使用该.on方法,该方法在初始加载之前和之后查找添加到 DOM 的元素。


更新:

我应该仔细看的。第二段代码不起作用,但使用了 .on 方法,很可能不起作用,因为您仍在尝试访问.edit-btn元素,此时我假设它是在页面加载后添加的。有效的代码片段是body首先访问元素。我会尝试用更好的解释来查找和更新,但是该.on方法仍然需要找到最初存在于 DOM 中的元素。从那里,它可以爬下树寻找.edit-btn元素。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

从另一个网站(XSS)获取html元素

来自分类Dev

jQuery-如何获取除一个元素外的所有* html *元素

来自分类Dev

有没有一种更有效的方式编写jQuery代码,该代码将在另一个元素悬停时更改一个元素的比例?

来自分类Dev

如何通过jQuery在HTML中获取具有特定类的第一个元素的ID值

来自分类Dev

从javascript中的另一个html元素获取元素内容

来自分类Dev

使用jQuery从另一个元素(表)替换HTML元素中的文本

来自分类Dev

使用jQuery从另一个元素(表)替换HTML元素中的文本

来自分类Dev

如何使用jQuery获取HTML元素ID

来自分类Dev

根据另一个元素的变化获取一个元素(jQuery)

来自分类Dev

使用jQuery和Canvas从html元素ID到另一个html元素画一条线

来自分类Dev

jQuery-将每个html()类值设置为另一个元素

来自分类Dev

点击时出现的jQuery出现在html中的另一个元素

来自分类Dev

获取数组的N个最后一个元素的最有效方法

来自分类Dev

在没有迭代的情况下获取具有一个类但没有另一个类的元素

来自分类Dev

如何将现有的 html 元素附加到另一个元素?

来自分类Dev

用另一个元素包装HTML元素?

来自分类Dev

如何根据jQuery中的另一个TD元素更改html表TD元素中的图标?

来自分类Dev

优雅/最佳解决方案,从迭代中获取最后一个元素

来自分类Dev

CSS或jQuery解决方案来选择“层次结构中的最后一个”元素?

来自分类Dev

jQuery:获取上一个元素

来自分类Dev

元素的jQuery onfocus具有另一个可单击的元素

来自分类Dev

Selenium“在另一个元素中获取元素”

来自分类Dev

如何获取新的jQuery元素,并在其后插入新的另一个元素?

来自分类Dev

Fullpage.js 如何链接到另一个带有 <a> 元素的 html 页面

来自分类Dev

在2个元素上调用的jQuery animate()仅对一个元素有效吗?

来自分类Dev

jQuery无法获取html元素

来自分类Dev

使用jQuery获取元素的.html()

来自分类Dev

使用 JavaScript 将 ID 从一个 html 元素传递到另一个元素

来自分类Dev

使用CSS / HTML将一个元素移到另一个元素之前

Related 相关文章

  1. 1

    从另一个网站(XSS)获取html元素

  2. 2

    jQuery-如何获取除一个元素外的所有* html *元素

  3. 3

    有没有一种更有效的方式编写jQuery代码,该代码将在另一个元素悬停时更改一个元素的比例?

  4. 4

    如何通过jQuery在HTML中获取具有特定类的第一个元素的ID值

  5. 5

    从javascript中的另一个html元素获取元素内容

  6. 6

    使用jQuery从另一个元素(表)替换HTML元素中的文本

  7. 7

    使用jQuery从另一个元素(表)替换HTML元素中的文本

  8. 8

    如何使用jQuery获取HTML元素ID

  9. 9

    根据另一个元素的变化获取一个元素(jQuery)

  10. 10

    使用jQuery和Canvas从html元素ID到另一个html元素画一条线

  11. 11

    jQuery-将每个html()类值设置为另一个元素

  12. 12

    点击时出现的jQuery出现在html中的另一个元素

  13. 13

    获取数组的N个最后一个元素的最有效方法

  14. 14

    在没有迭代的情况下获取具有一个类但没有另一个类的元素

  15. 15

    如何将现有的 html 元素附加到另一个元素?

  16. 16

    用另一个元素包装HTML元素?

  17. 17

    如何根据jQuery中的另一个TD元素更改html表TD元素中的图标?

  18. 18

    优雅/最佳解决方案,从迭代中获取最后一个元素

  19. 19

    CSS或jQuery解决方案来选择“层次结构中的最后一个”元素?

  20. 20

    jQuery:获取上一个元素

  21. 21

    元素的jQuery onfocus具有另一个可单击的元素

  22. 22

    Selenium“在另一个元素中获取元素”

  23. 23

    如何获取新的jQuery元素,并在其后插入新的另一个元素?

  24. 24

    Fullpage.js 如何链接到另一个带有 <a> 元素的 html 页面

  25. 25

    在2个元素上调用的jQuery animate()仅对一个元素有效吗?

  26. 26

    jQuery无法获取html元素

  27. 27

    使用jQuery获取元素的.html()

  28. 28

    使用 JavaScript 将 ID 从一个 html 元素传递到另一个元素

  29. 29

    使用CSS / HTML将一个元素移到另一个元素之前

热门标签

归档