gpt4 book ai didi

javascript - 使用 jQuery 从文件动态加载元素的 CSS + anchor 链接不起作用

转载 作者:行者123 更新时间:2023-11-28 05:49:43 24 4
gpt4 key购买 nike

我需要能够仅显示锚定的 div 并能够与该 anchor 共享链接。它没有按预期工作(尝试 bar1 (blank) bar2 (blank) 链接)。使用 anchor bar1bar2 (www.foo.bar/main.html#bar1) 加载 main.html 页面(如下所示)失败如果从文件加载 bar1(或 bar2),则正确处理 css 和 jQuery。另一方面,如果 #foo 元素作为 html 字符串附加,则锚定链接似乎有效(例如 www.foo.bar/main.html#foo)。要比较行为,请单击 foo (blank)bar1 (blank)bar1bar2 (blank)bar2 链接,bar1(空白)bar2(空白) 链接无法显示 bar1(或 bar2 ) 分区。显然它与异步文件加载有关。有办法解决这个问题吗?

ma​​in.html:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<script>
$("<div>").load("bar1.html #bar1", function() {
$('body').append($(this).html());
});
$("<div>").load("bar2.html #bar2", function() {
$('body').append($(this).html());
});

$(function() {
$( 'body' ).append("<div id='foo' style='background-color:#8F8;'>FOO</div>");
});
</script>
<style>
div:not(:target) { display: none; }
div:target { display: block; }
</style>
</head>
<body>
<a href="main.html#foo" target="_blank">foo (blank)</a>
<a href="main.html#bar1" target="_blank">bar1 (blank)</a>
<a href="main.html#bar1">bar1</a>
<a href="main.html#bar2" target="_blank">bar2 (blank)</a>
<a href="main.html#bar2">bar2</a>
</body>
</html>

bar1.html:

<div id='bar1'>BAR1</div>

bar2.html:

<div id='bar2'>BAR2</div>

最佳答案

不确定您完全想做什么。

但尝试将 jQuery 包装在文档就绪中

<script>
$(document).ready(function(){

$("<div>").load("bar.html #bar", function() {
$('body').append($(this).html());
});

$( 'body' ).append("<div id='foo' style='background-color:#8F8;'>FOO</div>");

});
</script>

关于javascript - 使用 jQuery 从文件动态加载元素的 CSS + anchor 链接不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37413184/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com