0

In my content_script.js for a chrome extension I'm working on I have:

document.addEventListener("funcDoRequest", function (params)
{
    alert('From content_script');
});

In my index.html web page how do I call this funcDoRequest from jQuery? Any examples? I need to pass detail.x parameters to it too.

I can do it like this without jQuery but I don't want this:

<script>
    var event = new CustomEvent('funcDoRequest', { 'detail': { something: 'something' } });
    var go = function () { document.dispatchEvent(event); }
</script>
<a href="javascript:go();">Click me</a>

Thanks.

Ken Williams
  • 829
  • 1
  • 10
  • 20

1 Answers1

0

A possible jQuery equivalent approach could set .click() event at <a> element, using .on() with "funcDoRequest" as custom event; calling .trigger() with "funcDoRequest" as first parameter, data object { something: "something" } as second parameter at click on a element ; where data object passed can be accessed at .on("funcDoRequest") handler as second argument params. Also added event.preventDefault() at a click handler.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<script>
  $(document).ready(function() {
    var doc = $(this); // `document`
    $("a").click(function(e) {
      e.preventDefault();
      doc.trigger("funcDoRequest", {
        "something": "something"
      })
    });
    // at `content_script.js`
    $(document).on("funcDoRequest", function(e, params) {
      console.log(e, params);
      alert(JSON.stringify(params))
    });
  })
</script>
<a href="#">Click me</a>
guest271314
  • 1
  • 15
  • 104
  • 177
  • @KenWilliams Can you describe "doesn't seem to work"? Is jQuery loaded at `document`? , at content script? – guest271314 May 06 '16 at 02:50
  • It just does nothing. Not even a javascript console error. jQuery is loading fine everywhere. To me this should work should it not? `// index.html jQuery("#clickme").on("click", function () { jQuery(document).trigger('funcDoRequest'); }); Click me` `// content_script.js document.addEventListener("funcDoRequest", function (intralaunch) { alert('Here in content_script'); });` This is stupid, I can't even add new lines. – Ken Williams May 06 '16 at 02:53
  • How is jQuery loaded at `document` ? and at `content_script.js` Are you sure jQuery is defined at both? – guest271314 May 06 '16 at 02:55
  • No, `.trigger()` would not call event at `document.addEventListener("funcDoRequest", function (intralaunch) { alert('Here in content_script'); })` – guest271314 May 06 '16 at 02:57
  • yes, definitely being loaded, I test with alert('test'); in jQuery(document).ready(function()) for both and I get the javascript alert. – Ken Williams May 06 '16 at 02:57
  • @KenWilliams Is jQuery listed in `manifest.json` ?, see http://stackoverflow.com/questions/3209790/jquery-in-google-chrome-content-script . Why are you using `document.addEventListener` instead of `$(document).on()` at `content_script.js` ? – guest271314 May 06 '16 at 03:04
  • Yes, its listed in content_script.js. I don't know why I'm using document.addEventListner instead of document.on(), I thought they were cross compatible. I ended up just doing this `jQuery("#clickme").on("click", function () { document.dispatchEvent(new CustomEvent('funcDoRequest', { 'detail': { paramname: 'paramval' } })); });` – Ken Williams May 06 '16 at 03:19
  • Have you tried with `js` at post at `// at content_script.js` ? – guest271314 May 06 '16 at 03:22
  • 1
    I'm not following you with `js`. Have I tested jquery in content_script.js? It works fine, yes. jQuery is added to the manifest.json too. I've concluded its not getting better then my comment above I think.. thanks for your help. – Ken Williams May 06 '16 at 03:30