溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
html與php數據交互的方法？這個問題可能是我們日常學習或工作經常見到的。希望通過這個問題能讓你收獲頗深。下面是小編給大家帶來的參考內容，讓我們一起來看看吧！
php文件與HTML頁面的數據交互
HTML發送（使用POST發送）
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
</head>
<body>
<div class='search-choose' id='search_choose'>
<ul>
<li id='search_1' class='search-selected'><a href='#'>dog</a></li>
<li id='search_2'><a href='#'>cat</a></li>
</ul>
</div>
<script type='text/javascript'>
searchArray = document.getElementsByTagName('li');//獲取名字為’li’的所有標簽項并存入數組
var writeArray = [];
for(var i = 0;i<searchArray.length;i++){
writeArray[i] = searchArray[i].innerText;//獲取標簽內容writeArray = ['dog','cat'];
}
//使用POST將數組writeArray發送到php文件servertest.php
var request = new XMLHttpRequest();
request.open("POST", "servertest.php");
var q = "data=" + writeArray;// q="name"+ value；
//發送內容體由name+value組成，此處name為data，value為writeArray
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send(q);
request.onreadystatechange = function() {
if (request.readyState===4) {
if (request.status===200) {
} else {
alert("發生錯誤：" + request.status);
}
}
}
</script>
</body>
</html>注：關鍵操作
var request = new XMLHttpRequest();
request.open("POST", "servertest.php");
var q = "data=" + writeArray;// 生成信息體q = “name “+ value
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send(q);
//HTML頁面POST發送內容后，php通過超全局變量 $_GET 和 $_POST收集php接收（使用超全局變量$_GET 和 $_POST收集）
<?php
//設置頁面內容是html編碼格式是utf-8
header("Content-Type: text/plain;charset=utf-8");
//判斷如果是get請求，則執行getMethod();；如果是POST請求，則執行postMethod()。
//$_SERVER是一個超全局變量，在一個腳本的全部作用域中都可用，不用使用global關鍵字
if ($_SERVER["REQUEST_METHOD"] == "GET") {
getMethod();
} elseif ($_SERVER["REQUEST_METHOD"] == "POST"){
postMethod();
}
function searchShow(){
}
function postMethod(){
$filename = 'save.txt';
//使用超全局變量 $_GET 和 $_POST收集name對應的value，如下
$searchWrite = $_POST["data"]；
//將獲取的HTML返回內容$searchWrite寫入文檔save.txt
file_put_contents($filename, $searchWrite);
$content = file_get_contents($filename);
echo $content;
}注：關鍵操作
searchWrite=searchWrite=_POST["data"]；
使用超全局變量 $_POST收集name對應的value放入$searchWrite，于是得到了HTML頁面發送的數據，可以用了
HTML頁面通過json獲取php的變量
php發送（通過echo返回json格式的數據對）
<?php
header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:POST,GET');
header('Access-Control-Allow-Credentials:true');
header("Content-Type: application/json;charset=utf-8");
if ($_SERVER["REQUEST_METHOD"] == "GET") {
getMethod();
} elseif ($_SERVER["REQUEST_METHOD"] == "POST"){
postMethod();
}
function getMethod(){
$filename = 'search_save.txt';//假設文件內容為dog，cat，pig,人
if (file_exists($filename)) {
$content = file_get_contents($filename);
$pattern = '/[\x{4e00}-\x{9fa5}_a-zA-Z0-9]+/u';
//[\x{4e00}-\x{9fa5}_a-zA-Z0-9]匹配中文、下劃線、字母、數字
preg_match_all($pattern, $content, $matches);
$searchRead = $matches[0];//通過正則表達式提取存儲列表到$searchRead數組['dog','cat','pig','人']
$defaultSearch = $searchRead[0];
$result = '{"success":false,"defaultSearch":""}';
if($_GET["data"]){
$result = '{"success":true,"defaultSearch":"'.$defaultSearch.'"}';
}
}
echo $result;//echo返回json格式化數據對{"success":true,"defaultSearch":"'.$defaultSearch.'"}
}
functionpostMethod(){
}注：關鍵操作
$result = '{"success":true,"defaultSearch":"'.$defaultSearch.'"}';//將待返回內容改為json格式
echo $result;//HTML頁面的json部分將從echo的輸出獲取json格式化數據對，因此echo輸出內容需要為json格式HTML接收（通過GET接收php echo返回的json格式的數據對）
<script type='text/javascript'>
$(document).ready(function(){
$.ajax({
type: "GET",
url: "default_search.php?data=" + value,//value為HTML向url發送的內容體，在php中可以通過超全局變量收集
dataType: "json",
//data為php使用echo返回的json格式的數據對,通過data.name的形式即可以使用name對應的value
success: function(data) {
if (data.success) {
alert(data.defaultSearch);
}
},
error: function(jqXHR){
alert("發生錯誤：" + jqXHR.status);
},
});
});
</script>關鍵操作：
$.ajax({
type: "GET",
url: "default_search.php?data=" + "searchArray",
dataType: "json",
success: function(data) {
If(data.success){alert(data.defaultSearch);}
//data為php使用echo輸出的json格式的數據對,通過data.name的形式即可以使用name對應的value
},
error: function(jqXHR){
alert("發生錯誤：" + jqXHR.status);
},
});
});感謝各位的閱讀！看完上述內容，你們對html與php數據交互的方法大概了解了嗎？希望文章內容對大家有所幫助。如果想了解更多相關文章內容，歡迎關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
