javascript - .unwrap() 在 .append().load() 之后不起作用

标签 javascript jquery html

我目前正在这样做:

$("div#js-product-list .products.row").append($("<div>").load('http://andreisdev.tk/alexstan/en/2-home?page=' + page_nr + ' .products.row article.product-miniature.js-product-miniature'));

然后我递增 page_nr ,这在这个问题中并不重要,因为它有效。

之后,我尝试打开 article 的包装它刚刚加载到页面中,使它们与另一个成为 sibling article它已经在页面中了,因为加载会覆盖您所做的选择,所以我必须做 div在我当前所有文章的末尾。

我正在尝试以这种方式打开它们:

$('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap();

所以基本上我选择了作为兄弟附加到当前 article 的 div s 我当时选择了 article它刚刚加载到那个新的 div 中并试图打开它们。

如果我在控制台中执行此操作,请先输入带有 .append().load() 的命令然后运行它,然后是 .unwrap()一个它工作得很好,如果我同时插入和运行它们虽然它不起作用,但我的 .js 文件发生了同样的事情。

我有点成功了:

setTimeout(function() {
  $('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap(); 
}, 500);

但必须有一种直接的方法。

EDIT !!!

由于评论不会被太多人看到,所以回复如下:

$("div#js-product-list .products.row").append($("<div>").load(''+link+' .products.row article.product-miniature.js-product-miniature', function() { $('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap(); }));

最佳答案

问题是因为 load() 是异步的,所以您试图打开尚不存在的元素。这就是为什么使用超时来延迟逻辑有效的原因。

更好的解决方案是使用 load() 的回调参数来提供一个函数,在内容添加到 DOM 后 执行您的解包逻辑。像这样:

$("div#js-product-list .products.row").append($("<div>").load('http://andreisdev.tk/alexstan/en/2-home?page=' + page_nr + ' .products.row article.product-miniature.js-product-miniature', function() {
  $('article.product-miniature.js-product-miniature ~ div article.product-miniature.js-product-miniature').unwrap();
}));

关于javascript - .unwrap() 在 .append().load() 之后不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48783992/

相关文章:

javascript - Greasemonkey 按钮点击

javascript - 如何获得对 Promise 的延迟对象的引用?

jquery - 如何从 rails 中的 Controller 调用方法?

html - 滚动的 div 高度溢出页脚并被隐藏

asp.net - 需要对 ASP.Net 兼容的 HTML->PDF 库的建议

javascript - 使用 jquery 操作 json 数据

javascript - 使用 Angularjs 在 json 文件中搜索和过滤字典

javascript - 使用 jquery 更改 div 文本

php - 从 dhtmlx 调度程序中删除 block 区域

html - 当页面 View 宽度为 737 w/bootstrap 时,div 下降