Verwenden Sie onclick button, um Skript auszuführen - HTML/Jquery/Javascript

Question

Kann jemand mir helfen, meine 3 Stücke Code zusammen zu setzen? Ich kann das Skript gut laufen und es funktioniert ich nicht nur wissen, wie dieses Ereignis zu einem Onclick Taste

1) User clicks button. 
2) Script is executed and sends message to API 

IN HTML

<script src="jquery-git.js" type="text/javascript"> 
<script src='slackapi.js'></script> 

Knopf ausrichten Skript

<fieldset> 
<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Send Message</button> 
</fieldset> 

auszuführen

slackapi.js Skript

var url = 'https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' 
var text = 'This is a message' 
$.ajax({ 
    data: 'payload=' + JSON.stringify({ 
     "text": text 
    }), 
    dataType: 'json', 
    processData: false, 
    type: 'POST', 
    url: url 
}); 

Answer 1

1. Option: -

Sie müssen wie unten slackapi.js Code in $(document).ready(function(){..}); und klicken einzuwickeln: -

slackapi.js: -

$(document).ready(function(){ 
    $('#contact-submit').on('click',function(e){ 
     e.preventDefault(); 
     var url = 'https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' 
     var text = 'This is a message' 
     $.ajax({ 
      data: 'payload=' + JSON.stringify({ 
       "text": text 
      }), 
      dataType: 'json', 
      processData: false, 
      type: 'POST', 
      url: url 
     }); 
    }); 
}); 

zweite Option ist: -

Wickeln Sie Ihre slackapi.js Code innerhalb einer Funktion und rufen Sie diese Funktion auf die Schaltfläche wie unten klicken: -

function runIt(){ 
    var url = 'https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' 
    var text = 'This is a message' 
    $.ajax({ 
     data: 'payload=' + JSON.stringify({ 
      "text": text 
     }), 
     dataType: 'json', 
     processData: false, 
     type: 'POST', 
     url: url 
    }); 

} 

Und es in der aktuellen Seite aufrufen wie unten: -

$(document).ready(function(){ 
    $('#contact-submit').on('click',function(e){ 
     e.preventDefault(); 
     runIt(); 
    }); 
}); 

Hinweis: - Sicher in b In beiden Fällen ist die jQuery-Bibliothek enthalten, bevor dieses Skript in Ihrem Code enthalten ist.

Answer 2

Dies sollte in Ihrer slackapi.js Datei arbeiten:

!function(){ 
    function someFunction(){ 
     var url = 'https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' 
     var text = 'This is a message' 
     $.ajax({ 
     data: 'payload=' + JSON.stringify({ 
      "text": text 
     }), 
     dataType: 'json', 
     processData: false, 
     type: 'POST', 
     url: url 
     }); 
    } 
    $('body').on('click', '#contact-submit', someFunction); 
}();