onclick event in corresponding button in PHP
PHP is server-side code, and html is client-side code. To implement the button's onclick event, the client calls the server-side function, so it must submit a request to the server.
There is a simple and crude way, that is, when the button is an a tag, you can directly write the PHP page to be executed in the href (or jump to PHP through JS by binding window.location to the button) . This approach requires designing a PHP code for each button.
My approach is: bind the click event to the button with event ajax, and then execute ajax.
1, server.php
<?php
if (isset($_POST['action']))
{
switch($_POST['action'])
{
case "btn1":btn1();break;
case "btn2":btn2();break;
default:break;
}
}
function btn1()
{
echo "hello 按钮1";
}
function btn2()
{
echo "hello 按钮2";
}
?>Method 1: index.php
<html>
<head>
<style>
div {width:600px;margin:200px auto;}
.btn {
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
}
.btn:hover {
background-color:#5cbf2a;
}
.btn:active {
position:relative;
top:1px;
}
#btn2 {float:right;}
</style>
<script type="text/javascript" language="javascript" src="jquery.js"></script>
<script type="text/javascript" language="javascript">
function fun(n) {
$.ajax({
url:"server.php", //the page containing php script
type: "POST", //request type
data:{action: n.value},
success:function(result){
alert(result);
}
});
}
function fun2(n) {
var url = "server.php";
var data = {
action : n.value
};
jQuery.post(url, data, callback);
}
function callback(data) {
alert(data);
}
</script>
</head>
<body>
<div>
<button type="button" class="btn" id="btn1" οnclick="fun(this)" value="btn1">按钮1</button>
<button type="button" class="btn" id="btn2" οnclick="fun2(this)" value="btn2">按钮2</button>
</div>
</body>
</html>Method two: index.php
<html>
<head>
<style>
div {width:600px;margin:200px auto;}
.btn {
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
}
.btn:hover {
background-color:#5cbf2a;
}
.btn:active {
position:relative;
top:1px;
}
#btn2 {float:right;}
</style>
<script type="text/javascript" language="javascript">
var xmlHttp;
function createXMLHttpRequest(){
//检查浏览器是否支持 XMLHttpRequest 对象
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function fun(n){
createXMLHttpRequest();
var url="server.php";
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlHttp.onreadystatechange = callback;
xmlHttp.send("action=" + n.value);
}
function callback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
alert(xmlHttp.responseText);
}
}
}
</script>
</head>
<body>
<div>
<button type="button" class="btn" id="btn1" οnclick="fun(this)" value="btn1">按钮1</button>
<button type="button" class="btn" id="btn2" οnclick="fun(this)" value="btn2">按钮2</button>
</div>
</body>
</html>Method one reference:
jQuery ajax - post() method:
http://www.w3school.com.cn/jquery/ajax_post.asp
Method 2 Reference:
Create XMLHttpRequest Object:
http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_create.asp
Send request to the server:
http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_send.asp
Server response:
http://www.w3school.com.cn /ajax/ajax_xmlhttprequest_response.asp
onreadystatechange event:
http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_onreadystatechange.asp
For more related questions, please visit the PHP Chinese website: PHP Video Tutorial
The above is the detailed content of onclick event in corresponding button in PHP. For more information, please follow other related articles on the PHP Chinese website!
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
1386
52
Alipay PHP SDK transfer error: How to solve the problem of 'Cannot declare class SignData'?
Apr 01, 2025 am 07:21 AM
Alipay PHP...
Explain JSON Web Tokens (JWT) and their use case in PHP APIs.
Apr 05, 2025 am 12:04 AM
JWT is an open standard based on JSON, used to securely transmit information between parties, mainly for identity authentication and information exchange. 1. JWT consists of three parts: Header, Payload and Signature. 2. The working principle of JWT includes three steps: generating JWT, verifying JWT and parsing Payload. 3. When using JWT for authentication in PHP, JWT can be generated and verified, and user role and permission information can be included in advanced usage. 4. Common errors include signature verification failure, token expiration, and payload oversized. Debugging skills include using debugging tools and logging. 5. Performance optimization and best practices include using appropriate signature algorithms, setting validity periods reasonably,
Describe the SOLID principles and how they apply to PHP development.
Apr 03, 2025 am 12:04 AM
The application of SOLID principle in PHP development includes: 1. Single responsibility principle (SRP): Each class is responsible for only one function. 2. Open and close principle (OCP): Changes are achieved through extension rather than modification. 3. Lisch's Substitution Principle (LSP): Subclasses can replace base classes without affecting program accuracy. 4. Interface isolation principle (ISP): Use fine-grained interfaces to avoid dependencies and unused methods. 5. Dependency inversion principle (DIP): High and low-level modules rely on abstraction and are implemented through dependency injection.
How to automatically set permissions of unixsocket after system restart?
Mar 31, 2025 pm 11:54 PM
How to automatically set the permissions of unixsocket after the system restarts. Every time the system restarts, we need to execute the following command to modify the permissions of unixsocket: sudo...
Explain the concept of late static binding in PHP.
Mar 21, 2025 pm 01:33 PM
Article discusses late static binding (LSB) in PHP, introduced in PHP 5.3, allowing runtime resolution of static method calls for more flexible inheritance.Main issue: LSB vs. traditional polymorphism; LSB's practical applications and potential perfo
How to debug CLI mode in PHPStorm?
Apr 01, 2025 pm 02:57 PM
How to debug CLI mode in PHPStorm? When developing with PHPStorm, sometimes we need to debug PHP in command line interface (CLI) mode...
Explain late static binding in PHP (static::).
Apr 03, 2025 am 12:04 AM
Static binding (static::) implements late static binding (LSB) in PHP, allowing calling classes to be referenced in static contexts rather than defining classes. 1) The parsing process is performed at runtime, 2) Look up the call class in the inheritance relationship, 3) It may bring performance overhead.
How to send a POST request containing JSON data using PHP's cURL library?
Apr 01, 2025 pm 03:12 PM
Sending JSON data using PHP's cURL library In PHP development, it is often necessary to interact with external APIs. One of the common ways is to use cURL library to send POST�...
