个人中心
gpt4 book ai didi

javascript - 使用 JQuery 更改 SVG 中的元素

转载 作者：可可西里 更新时间：2023-11-01 13:35:46 25 4
gpt4 key购买 nike

我有这个:

<button type="button" id="btn" value="Release">Click Here!</button>     
...

<body>
<object data="books.svg" type="image/svg+xml" id="svg" width="1300" height="700"></object>
</body>

<script>
var a = document.getElementById("svg");
var svgDoc

a.addEventListener("load", function() {
     svgDoc = a.contentDocument;
}, false);

$(window).load(function() {
    console.log($(svgDoc).find("#book1").attr("fill"))
});

$(document).ready(function() {
    $("#btn").click(function() {
        console.log("You are here")
        $(svgDoc).find("#book1").attr("fill","#000000")
    })
})

$(window).load(function() { 有效，但是 

$(document).ready(function() {
        $("#btn").click(function() {

...没有。这是为什么？

编辑:添加了更多代码

编辑 #2:让它工作。按照 Robert Longson 的建议修改了这个:

$(document).ready(function() {....})

为此:

a.addEventListener("load", function() {...}, false);

JQuery:

$("#btn").on('click', function() {...}

最佳答案 

$(document).ready();

在解析器完成该页面的 DOM 之后，但在所有嵌入对象初始化之前，一旦 Web 浏览器运行就会触发。如果您想尽快执行 JavaScript，这很有用，但在您的情况下这不是您想要的。我想它是在 DOMContentLoaded 上实现的与 ready() description 匹配的事件

您需要 UA 加载 <object>内容以便对其进行操作。您可以附加到 <object>元素加载事件或您对页面加载所做的操作。

关于javascript - 使用 JQuery 更改 SVG 中的元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16823007/

25 4 0
文章推荐： c# - 将默认值添加到下拉列表中
文章推荐： php - 能否通过php中的ini_set()函数设置 "allow_url_fopen" "ON"
文章推荐： PHP 将 csv 列读入数组
文章推荐： html - 当内容不占据整个页面时的 CSS Sticky Footer
可可西里
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com