JQuery - ScrollTop not working in Chrome Extension
Question
I've been trying to figure this out for a while now, but I'm at my wit's end and have given up all hope.
Here is my unpacked chrome extension: nexrem.com/test/extension-test2 - Copy.zip
Exhibit A:
- Navigate into the template folder
- run test.html in Chrome
- Click on the "Footer link"
- Observe it scroll correctly to the footer
Exhibit B: Currently, the extension basically replaces the entirety of html on the page.
- Install the unpacked extension
- Go to some website (for the sake of testing, one that isn't filled with all sorts of scripts. or just make a local blank html file)
- Click the extension icon in chrome
You will see the exact same page as when you ran just the test.html ;however, the jquery scrolling no longer works . I fail to understand why.
If someone can explain this to me, assist in a solution or at least point in the right direction, I'd greatly appreciate it!
1 answers
solution1
1 ACCPTED 2016-03-01 03:37:29
According to load
jQuery uses the browser's .innerHTML property to parse the retrieved document and insert it into the current document. During this process, browsers often filter elements from the document such as
<html>,<title>, or<head>elements. As a result, the elements retrieved by.load()may not be exactly the same as if the document were retrieved directly by the browser .
And after digging into your html code after you click the browser action, it seems the body tag is not included.
You can use the following code instead load
var template = chrome.extension.getURL('template/test.html');
console.log(template);
$.get(template, function(data) {
document.open();
document.write(data);
document.close();
$.cache = {};
}, "text");
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.