关于JavaScript在html按钮上单击运行PHP函数

Run PHP function on html button click

我需要在单击按钮时运行一些PHP函数。我知道这不应该是PHP的用途,而是JS应该这样做,但是当用户请求时,我的函数在从服务器收集数据方面做了什么。具体来说,它获取一些用户数据并将其写入文件,用户应该决定将收集哪些数据。我该怎么做?我在button click上看到了运行后的php文件,但我仍然不知道如何使用它。我在学习,所以请不要太严厉

我试过onclick()和各种各样的东西,但没有带来任何有用的东西。


每当您通过HTTP请求访问一个PHP文件时,它都会运行,无论是GET、POST、PUT。

您可以使用jquery/ajax在单击按钮时发送请求,甚至只需更改浏览器的URL即可导航到PHP地址。

根据post/get中发送的数据,可以让switch语句运行不同的函数。

通过get指定函数

您可以使用下面的代码:如何从存储在变量中的字符串以及switch语句中调用php函数,以根据发送的数据自动调用相应的函数。

所以在PHP方面,您可以有这样的功能:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php

//see http://php.net/manual/en/function.call-user-func-array.php how to use extensively
if(isset($_GET['runFunction']) && function_exists($_GET['runFunction']))
call_user_func($_GET['runFunction']);
else
echo"Function not found or wrong input";

function test()
{
echo("test");
}

function hello()
{
echo("hello");
}

?>

您可以使用地址栏进行最简单的GET请求测试:

1
http://127.0.0.1/test.php?runFunction=hellodddddd

结果:

1
2
3
Function not found or wrong input

http://127.0.0.1/test.php?runFunction=hello

结果:

1
hello

发送数据

通过jquery获取请求

请参阅:http://api.jquery.com/jquery.get/

1
2
3
4
$.get("test.cgi", { name:"John"})
.done(function(data) {
  alert("Data Loaded:" + data);
});

通过jquery发布请求

参见:http://api.jquery.com/jquery.post/

1
$.post("test.php", { name:"John"} );

通过javascript位置获取请求

参见:http://www.javascripter.net/faq/buttonli.htm

1
2
3
<input type=button
value="insert button text here"
onClick="self.location='Your_URL_here.php?name=hello'">

读取数据(php)

阅读文章请参阅php turotial,获取:http://www.tizag.com/phpt/post get.php

有用的链接

http://php.net/manual/en/function.call-user-func.phphttp://php.net/manual/en/function.function-exists.php


如果您想发出一个服务器请求,您应该使用Ajax,这样您就可以将所需的参数发送到服务器,并且它可以用这些参数运行任何您想要的PHP。

纯javascript示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<input type="text" id="name" value="..."/>
<input type="text" id="location" value="..."/>
<input type="button" onclick="ajaxFunction();" value="Submit" />

<script type="text/javascript">    
    function ajaxFunction(){
        var ajaxRequest;  // The variable that makes Ajax possible!

        try{
            // Opera 8.0+, Firefox, Safari
            ajaxRequest = new XMLHttpRequest();
        } catch (e){
            // Internet Explorer Browsers
            try{
                ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try{
                    ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e){
                    // Something went wrong
                    alert("Your browser broke!");
                    return false;
                }
            }
        }
        // Create a function that will receive data sent from the server
        ajaxRequest.onreadystatechange = function(){
            if(ajaxRequest.readyState == 4){
                var ajaxDisplay = document.getElementById('ajaxDiv');
                ajaxDisplay.innerHTML = ajaxRequest.responseText;
            }
        }
        var name = document.getElementById('name').value;
        var location = document.getElementById('location').value;
        var queryString ="?name=" + name +"&location=" + location;
        ajaxRequest.open("POST","some.php" + queryString, true);
        ajaxRequest.send(null);
    }

jquery ajax示例:http://api.jquery.com/jquery.ajax/

1
2
3
4
5
6
7
$.ajax({
  type:"POST",
  url:"some.php",
  data: { name:"John", location:"Boston" }
}).done(function( msg ) {
  alert("Data Saved:" + msg );
});

您可以使用一个文件调用函数,例如functions.php

PHP

1
2
3
4
5
6
7
8
<?php
  myFunction($Name, $Location) {
      // etc...
  }
  myFunction2() {
  }
  // ... many functions
?>

某物

1
2
3
4
5
6
7
<?php include("functions.php");    
$Name = $_POST['name'];
$Location = $_POST['location'];

myFunction($Name, $Location);

// make what you want with these variables...?>


使用Ajax,一个简单的例子,

HTML

1
<button id="button">Get Data</button>

JavaScript

1
2
3
4
5
6
7
var button = document.getElementById("button");

button.addEventListener("click" ajaxFunction, false);

var ajaxFunction = function () {
    // ajax code here
}

或者查看jquery ajaxhttp://api.jquery.com/jquery.ajax/


1
2
3
4
5
6
7
8
9
10
11
12
<?php
if (isset($_POST['str'])){
function printme($str){
echo $str;
}

printme("{$_POST['str']}");
}
?>
<form action="<?php $_PHP_SELF ?>" method="POST">
<input type="text" name="str" /> <input type="submit" value="Submit"/>
</form>

这取决于您想要运行什么函数。如果您需要在服务器端做一些事情,比如查询数据库或在会话中设置一些事情,或者在客户机端做不到的事情,那么您需要Ajax,否则您可以在客户机端用JavaScript来做。当你可以在客户端做你需要做的事情时,不要让服务器工作。

jquery提供了一种简单的Ajax方法:http://api.jquery.com/jquery.ajax/


在PHP文件上使用Ajax请求,然后在页面上显示结果,而不需要重新加载。

http://api.jquery.com/load下载/如果您不需要任何post数据,这是一个简单的解决方案。