"- chamar uma função no PHP através do JavaScript"
Você não pode fazer isso! O PHP é uma linguagem que roda no servidor (back-end) enquanto (no seu caso) o JavaScript roda no cliente (front-end).
Tem formas do JavaScript "comunicar" com o PHP. Vou exemplificar!
Mas, antes de mais nada, precisa se perguntar: a função PHP vai ser chamada já na renderização da página e não depende de dados posteriores à renderização?
Se sim, então você pode fazer direto na renderização:
(o que acho má-prática, desnecessário, gambiarra, etc)
<?php
function minhaFuncaoPHP($param1, $param2){
return ($param1+$param2);
}
$arg1 = 10;
$arg2 = 7;
?>
<button type="button" onclick="funcaoJava()">Enviar</button>
<script>
function funcaoJava(){
let retornoPHP = '<?php echo minhaFuncaoPHP($arg1, $arg2); ?>';
alert(retornoPHP);
}
</script>
Se não, você terá que criar uma página que recebe uma requisição do JavaScript. Dessa forma, você pode transmitir dados para o PHP e retornar estes dados para o JavaScript.
Essa página em PHP é chamada de WebService (não precisa ser obrigatoriamente em PHP) e essa prática é, popularmente, conhecida como "consumir um webservice". Como se trata de JavaScript, dizemos "consumir um webservice com AJAX".
(Fonte: W3Schools - AJAX Introduction)
Veja esse simples exemplo:
1) Webservice em PHP: funcao.php
<?php
function minhaFuncaoPHP($param1, $param2){
return ($param1+$param2);
}
$dados = json_decode(file_get_contents('php://input'), true);
$resposta = minhaFuncaoPHP($dados['campo1'], $dados['campo2']);
echo json_encode($resposta);
Observe que essa página simplesmente: 1) carrega a função; 2) "parsea" os dados recebidos via AJAX; 3) chama a função que trata os dados; 4) "mostra" esses dados no formato do JSON.
2) Cliente em HTML/JavaScript:
<div>
<label>
Campo 1
<input type="number" name="campo1">
</label>
<label>
Campo 2
<input type="number" name="campo2">
</label>
</div>
<div>
<button type="button">Enviar</button>
</div>
<script>
let btn = document.querySelector('button[type=button]');
btn.addEventListener(
'click',
function(){
let data = {
campo1: document.querySelector('input[name=campo1]').value,
campo2: document.querySelector('input[name=campo2]').value
}
let ajax = new XMLHttpRequest();
ajax.open('post', 'funcao.php');
ajax.onreadystatechange = function(){
if (
ajax.readyState == 4
&& ajax.status >= 200
&& ajax.status <= 400
) {
let respostaAjax = JSON.parse(ajax.responseText);
// Aqui os dados já foram tratados.
// Faça o que quiser com eles:
console.log(respostaAjax);
}
}
ajax.send(JSON.stringify(data));
},
false
);
</script>
Só entenda o seguinte: isso é um exemplo mínimo! Não fique amarrado ao Ctrl+C / Ctrl+V. Considere ler alguns artigos sobre o assunto e aprofunde-se nesse assunto de imensa utilidade.
Leituras recomendadas:
Wikipédia - Web service
W3Schools - AJAX Introduction
SOen: Send JSON data to PHP using XMLHttpRequest w/o jQuery
PHP: php://
- Manual
SOen: PHP “php://input” vs $_POST
funcaoJava
no JavaScript!