AJAX成功调用定义的函数

Question

I'm having trouble calling an external function on success. The ideal solution would let me also pass in some parameters to the function!

ie success: writeToConsole("successful");

Javascript:

$(document).ready(function () {
  $(".portalControls").find(".syncButton").click(triggerSync);    
});

function triggerSync(e) {
  e.preventDefault();
  $.ajax({
    type: "GET",
    url: "sync",
    dataType: "text",
    success: writeToConsole,
      error: writeToConsole
    }
  });
}

function writeToConsole(consoleText) {
  $.find("portalConsole").text(consoleText);
}

HTML:

<!-- Scripts -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="/js/scripts.js"></script>

Errors I get: "Uncaught TypeError: $.ajax is not a function" . I never get the request on my server.

EDIT: Problem was to do with having a jQuery slim script on another page. Removing that fixed the error.

Answer 1

You are using slim version of jQuery. It Doesn't support ajax Calling. Use following

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

Update Check out following JSfiddle

Answer 2

As @Santosh said make sure you add the following code in your head:

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

Also I found out there is a few errors in your code, I tried to find out what you want to achieve and make a code out from it, you should look though is this what you want

 $(document).ready(function() { $(".portalControls").find(".syncButton").click(triggerSync); }); function triggerSync(e) { e.preventDefault(); $.ajax({ type: "GET", url: "sync", dataType: "text", success: writeToConsole("fine"), error: writeToConsole("error") }); } function writeToConsole(consoleText) { $(".portalConsole").text(consoleText); } 

 <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <div class="portalControls"> <button class="syncButton"> click </button> </div> <div class="portalConsole"> </div> 

For the issue I found out first there is one more } here

    success: writeToConsole,
    error: writeToConsole
}
^
});

Second, I don't know why you use $.find("portalConsole").text(consoleText); , if you want to change the text, I'll use $(".portalConsole").text("text here...") also notice there isn't a . or a # before portalConsol.

Answer 3

只需添加上面的CDN脚本标签

<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>