Chào mừng bạn đến với hướng dẫn về cách chuyển các biến và mảng PHP sang Javascript. PHP là phía máy chủ và JavaScript là phía máy khách, vậy làm cách nào để kết hợp chúng lại với nhau?
Một cách nhanh chóng và dễ dàng để chuyển một biến từ PHP sang Javascript là sử dụng thẻ echo ngắn. Ví dụ
<?php $phpvar = "FOO"; ?>
var jsvar = "<?=$phpvar?>";
Nhưng có nhiều cách hơn để làm như vậy, tùy thuộc vào tình huống. Chúng tôi sẽ xem qua các ví dụ khác nhau trong hướng dẫn này – Đọc tiếp để tìm hiểu
ⓘ Tôi đã bao gồm một tệp zip chứa tất cả mã ví dụ khi bắt đầu hướng dẫn này, vì vậy bạn không cần phải sao chép-dán mọi thứ… Hoặc nếu bạn chỉ muốn đi sâu vào
TLDR – TRANG TRÌNH BÀY NHANH
Tải xuống & Ghi chú
TẢI XUỐNG & LƯU Ý
Đầu tiên, đây là liên kết tải xuống mã ví dụ như đã hứa
GHI CHÚ NHANH
Nếu bạn phát hiện ra một lỗi, hãy bình luận bên dưới. Tôi cũng cố gắng trả lời các câu hỏi ngắn, nhưng đó là một người so với cả thế giới… Nếu bạn cần câu trả lời gấp, vui lòng xem danh sách các trang web của tôi để được trợ giúp về lập trình
MÃ VÍ DỤ TẢI XUỐNG
Nhấp vào đây để tải xuống tất cả mã ví dụ trong tệp zip – Tôi đã phát hành mã này theo Giấy phép MIT, vì vậy vui lòng xây dựng trên mã đó nếu bạn muốn
CHUYỂN CÁC BIẾN PHP SANG JAVASCRIPT
Được rồi, bây giờ chúng ta hãy đi sâu vào các cách khác nhau để chuyển các biến PHP sang Javascript
Chà, điều này có thể gây ngạc nhiên cho một số người mới bắt đầu, nhưng hãy nhớ rằng Javascript là một ngôn ngữ thông dịch?
1B) PHP THẺ ECHO NGẮN ĐẾN “CHÈN GIÁ TRỊ“
1b-ngắn-tiếng vang. php
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
Thực sự rất khó để thực hiện
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
1 mỗi lần, vì vậy đây là một tiện ích nhanh chóng trong PHP, thẻ echo ngắn
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
2. Đúng, điều này tương đương với việc làm
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
3
VÍ DỤ 2) CHÈN BIẾN PHP VÀO DẠNG HTML
2 đầu vào. php
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
Chúng tôi vẫn đang sử dụng thẻ echo ngắn PHP ở đây, nhưng “chèn” giá trị vào trường
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
4 HTML và sử dụng Javascript để lấy trường biểu mẫu. Một cách đường vòng, nhưng điều này có ý nghĩa nếu bạn đang làm việc với các biểu mẫu
VÍ DỤ 3) SỬ DỤNG JSON ĐỂ QUA Mảng
3-json. php
________số 8_______
Đáng buồn thay, chúng ta không thể truyền một mảng (hoặc đối tượng) vì nó là. Trong trường hợp này, chúng ta có thể
Sử dụng
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
5 trong PHP để biến mảng thành chuỗi được mã hóa JSON
Thẻ echo ngắn PHP cũ tốt để xuất chuỗi, nhưng được kết hợp với Javascript
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
6 để biến chuỗi được mã hóa JSON trở lại thành một mảng
Ghi chú bổ sung nhanh và tóm tắt
JSON là viết tắt của “Ký hiệu đối tượng tiêu chuẩn Javascript”. Một cách để biểu diễn mảng và đối tượng dưới dạng chuỗi
PHP –
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
5 biến một mảng thành một chuỗi
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
8 biến chuỗi JSON trở lại một mảng
Javascript –
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
9 biến một mảng thành một chuỗi
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) PHP SHORT ECHO TAG TO ECHO VARIABLE -->
<script>
var jsvar = "<?=$phpvar?>";
console.log(jsvar);
</script>
6 biến chuỗi trở lại một mảng
VÍ DỤ 4) AJAX ĐỂ TÌM GIÁ TRỊ
4A) HTML & JAVASCRIPT
4a-ajax. html
<!-- (A) AJAX FETCH DATA FROM SERVER -->
<script>
function doAJAX () {
fetch("4b-ajax.php")
.then(res => res.text())
.then(data => console.log(data));
}
</script>
<!-- (B) GO! -->
<input type="button" value="AJAX Fetch" onclick="doAJAX()">
Nếu bạn chưa nghe thì AJAX là viết tắt của “Javascript và XML không đồng bộ”. Nói một cách đơn giản, gửi hoặc lấy dữ liệu từ máy chủ mà không cần tải lại toàn bộ trang. AJAX rất dễ thực hiện và có lẽ nó được coi là “cách thích hợp nhất để truyền biến”
Lấy dữ liệu từ tập lệnh PHP –
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
1
Sau đó trả về kết quả dưới dạng văn bản
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
2
Cuối cùng, hãy làm bất cứ điều gì bạn cần với dữ liệu
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
3
P. S. Lưu ý thêm rằng AJAX sẽ không hoạt động với
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
4 (mở trực tiếp tệp HTML trong trình duyệt). Thay vào đó, hãy sử dụng một máy chủ web phù hợp với
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
5
4B) PHP PHÍA MÁY CHỦ
4b-ajax. php
<?php
$phpvar = "Foo";
echo $phpvar;
Về phía máy chủ, chỉ cần thực hiện bất kỳ thao tác xử lý PHP nào và xuất nó, điều này sẽ được chọn trong lệnh gọi AJAX –
<!-- (A) PHP VARIABLE -->
<?php $phpvar = "Foo"; ?>
<!-- (B) INSERT INTO HTML FORM -->
<form onsubmit="return demo()">
<input type="text" id="myTxt" value="<?=$phpvar?>">
<input type="submit" value="Go">
</form>
<!-- (C) JS GET FIELD VALUE -->
<script>
function demo () {
// (C1) GET FIELD VALUE
var jsvar = document.getElementById("myTxt").value;
console.log(jsvar);
// (C2) PREVENT FORM SUBMIT
return false;
}
</script>
6
VÍ DỤ 5) JSON & AJAX ĐỂ QUA Mảng
5A) HTML & JAVASCRIPT
5a-ajax-json. html
<!-- (A) AJAX FETCH DATA FROM SERVER -->
<script>
function doAJAX () {
fetch("5b-ajax.php")
.then(res => res.json())
.then(data => console.log(data));
}
</script>
<!-- (B) GO! -->
<input type="button" value="AJAX Fetch" onclick="doAJAX()">
Vẫn còn nhớ "AJAX tìm nạp" từ trước đó?
PHP có thể truy cập các biến JavaScript không?
Cách chuyển một biến JavaScript sang PHP là thông qua một yêu cầu . Loại URL này chỉ hiển thị nếu chúng ta sử dụng hành động GET, hành động POST ẩn thông tin trong URL. Phía máy chủ (PHP). Trên trang PHP phía máy chủ, chúng tôi yêu cầu dữ liệu được gửi theo biểu mẫu và hiển thị kết quả.
PHP có thể tương tác với JavaScript không?
JavaScript được sử dụng làm phía máy khách để kiểm tra và xác minh thông tin chi tiết về máy khách và PHP là phía máy chủ được sử dụng để tương tác với cơ sở dữ liệu . Trong PHP, HTML được sử dụng như một chuỗi trong mã. Để hiển thị nó cho trình duyệt, chúng tôi tạo mã JavaScript dưới dạng một chuỗi trong mã PHP.
Làm cách nào để chuyển dữ liệu và biến từ PHP sang JavaScript?
Chúng ta có thể truyền dữ liệu từ PHP sang JavaScript theo hai cách tùy theo tình huống. Đầu tiên, chúng ta có thể truyền dữ liệu bằng cách sử dụng toán tử gán đơn giản nếu chúng ta muốn thực hiện thao tác trên cùng một trang. Khác chúng ta có thể chuyển dữ liệu từ PHP sang JavaScript bằng Cookies. Cookie hoạt động ở phía máy khách.
Làm cách nào để sử dụng biến JavaScript trong PHP trên cùng một trang?
Bạn có thể dễ dàng lấy giá trị biến JavaScript trên cùng một trang trong PHP. Hãy thử đoạn mã sauL. php echo "
