Use jQuery in a Safari Extension

Question

For some reason in my global.html file jquery doesn't work for me.

here is the code that is in my global.html file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <title>Hello World</title>
    <meta name="generator" content="myHTMLEdit | www.myownapp.com" />
    <script type="text/javascript">

    function performCommand(event)
    {
        if (event.command === "alert") {
        alert("event fired...");

            var $x = $("meta[property=og:image]").attr("content");
            alert($x);
            alert("completed.");
        }
    }
    function validateCommand(event)
    {
        if (event.command === "alert") {
            event.target.disabled = !event.target.browserWindow.activeTab.url;
        }
    }
    safari.application.addEventListener("command", performCommand, true);
    safari.application.addEventListener("validate", validateCommand, true);
    </script>
</head>
<body>
</body>
</html>

I'm using alerts to see if my jquery is working. it will alert "event fired..." but stops there (no second alert). however, if I delete the two lines of jquery both alerts pop up. I'm creating a toolbar item that when I click it the event fires if that helps you solve this issue.

Only one error when I press inspect global page

error

Have you tried looking at the global page's error log in its Web Inspector window (by clicking Inspect Global Page in the Extension Builder)? — chulster, Dec 12 '12 at 04:34
@s0ulp1xel That error is too small to read. Can you paste it as text in stead? — Jørgen R, Dec 12 '12 at 12:38
@jurgemaister here's a direct link to the photo [link](http://i.stack.imgur.com/kGPGj.png) — atomikpanda, Dec 12 '12 at 12:44
@s0ulp1xel It says syntax error. Try linking to the non minified version. And don't use W3Schools for anything. [Here is the full version](http://code.jquery.com/jquery-1.8.3.js) linked from jquery.com — Jørgen R, Dec 12 '12 at 12:48
@jurgemaister When I use the one from jquery.com I get [THIS](http://cl.ly/LWya) error — atomikpanda, Dec 12 '12 at 13:02

score 1 · Answer 1 · answered Dec 12 '12 at 13:54

1

Your selector sytax is invalid. If you check this JS and check your javascript console, you'll see the error message

Uncaught Error: Syntax error, unrecognized expression: meta[property=og:image]

I don't know how your meta tag looks like, but if it's like in the fiddle, the selector would be like

$('meta[og="image"]')

As you can see in the jQuery reference.

Note for future questions: This would be easier to resolve if you post the full error message in stead of an image containing only part of it.

answered Dec 12 '12 at 13:54

Jørgen R

10,568
7
42
59

when I'm on the url https://itunes.apple.com/us/app/angry-birds-free/id409807569?mt=8 and I paste javascript:var $x = $("meta[property=og:image]").attr("content");alert($x); it works but in my safari ext it doesn't? – atomikpanda Dec 12 '12 at 16:55
and what if you change `$("meta[property=og:image]")` to `$('meta[property="og:image"]')`. Does that make any difference for the plugin? – Jørgen R Dec 13 '12 at 09:15
In the plugin but it doesn't open the alert the icon URL but it makes it to the "completed" alert – atomikpanda Dec 13 '12 at 13:19

Use jQuery in a Safari Extension

1 Answers1