Jira issue collector code works when embedded in html but not in separate javascript file

Question

I have created a jira issue collector for my web page. I want this issuer to be activated when I press a button. When I embed the following code inside html it works great :

<a href="#" id="Trigger" class='btn btn-primary'>Jira Issue</a>
<script type="text/javascript" src="htpps...."></script>
<script type="text/javascript">window.ATL_JQ_PAGE_PROPS =  {
        "triggerFunction": function(showCollectorDialog) {
         jQuery("#Trigger").click(function(e) {
         e.preventDefault();
         showCollectorDialog();
         });
}};</script>

But this it prompts for user name and password every time I load the page. I want to prompt only when I click the Jira Issue button. So I inserted the following code inside a js file :

$(document).ready(function() {
$('#Trigger').click(function (event) {
   jQuery.ajax({
      url: "https:....",
      type: "get",
      cache: true,
      dataType: "script"
   });

window.ATL_JQ_PAGE_PROPS =  {
  "triggerFunction": function(showCollectorDialog) {
   jQuery("#Trigger").click(function(e) {
    e.preventDefault();
    showCollectorDialog();
     });
    }};
   });
  });

But this way it shows the loading icon without ever to open the jira modal window. I'm using jquery-3.2.1.min.js. I have also tried to run the code without $(document).ready(function() but no success.The console output form the browser debugger when I press the button is the following :

 jquery-3.2.1.min.js:4 Uncaught TypeError: a.indexOf is not a function
 at r.fn.init.r.fn.load (jquery-3.2.1.min.js:4)
 at ATL_JQ.IssueDialog.show (com.atlassian.jira.collector.plugin.jira-issue-
 collector-plugin:issuecollector-embededjs.js?locale=en-
 US&collectorId=b936f358:3)
 at showDialog (com.atlassian.jira.collector.plugin.jira-issue-collector-
 plugin:issuecollector-embededjs.js?locale=en-US&collectorId=b936f358:3)
 at HTMLAnchorElement.<anonymous> (main.js:14)
 at HTMLAnchorElement.dispatch (jquery-3.2.1.min.js:3)
 at HTMLAnchorElement.q.handle (jquery-3.2.1.min.js:3)

The first may be caused by jquery event aliases like .load, .unload or .error deprecated since jQuery 1.8, but my code omits these aliases. Also the line main.js:14 refers to code showCollectorDialog();
What am I doing wrong here?

Answer 1

This is still an issue.

You can degrade your JQuery version to 2.2.4 to resolve

Answer 2

按照你上面的方法，点击事件后出现对话框，但是对话框上下错位。