How to assign javascript value to PHP

With the development of front-end technology, JavaScript is used more and more widely. In web applications, it is often necessary to pass some values ​​​​from the front-end page to the back-end PHP for processing, which involves the transfer problem between JavaScript values ​​​​and PHP. This article will introduce several methods of assigning JavaScript values ​​​​to PHP.

1. Use form submission

The most common way to pass JavaScript values ​​to PHP is through form submission. In JavaScript, we can obtain the values ​​of form elements through DOM operations, then assign these values ​​​​to hidden input elements, and finally submit the form to the back-end PHP for processing. The sample code is as follows:

<form action="handle.php" method="post">
  <input type="hidden" name="username" id="username">
  <input type="hidden" name="age" id="age">
  <button type="submit" onclick="submitForm()">提交</button>
</form>

<script>
  function submitForm() {
    var username = document.getElementById("username").value;
    var age = document.getElementById("age").value;
    document.getElementById("username").value = username;
    document.getElementById("age").value = age;
  }
</script>

In this example, we define a form containing two hidden input elements. The values ​​of these two elements are the username and age values ​​obtained in JavaScript. When the submit button is clicked, the submitForm() function is called, the obtained values ​​are assigned to the two hidden elements, and then the form is submitted to the back-end PHP for processing.

When processing the values ​​passed by the form, you can use the $_POST array in PHP to obtain these values. The sample code is as follows:

$username = $_POST['username'];
$age = $_POST['age'];

2. Use AJAX technology

In addition to passing JavaScript values ​​through form submission, another common method is to use AJAX technology. AJAX can send a request to the backend PHP without refreshing the page, thereby passing JavaScript values ​​to PHP for processing. The sample code is as follows:

<script>
  var username = '张三';
  var age = 18;

  var xhr = new XMLHttpRequest();
  xhr.open('POST', 'handle.php', true);
  xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  xhr.onreadystatechange = function () {
    if(xhr.readyState == 4 && xhr.status == 200) {
      console.log(xhr.responseText);
    }
  };
  xhr.send('username=' + username + '&age=' + age);
</script>

In this example, we define a JavaScript object containing two variables: username and age. Then an XMLHttpRequest object is created, and the request type and address are specified through the open() method. The Content-type is set to application/x-www-form-urlencoded in the request header. This is because we are going to use the POST method to send the request to the back-end PHP and need to put the data in the request body. Finally, use the send() method to send the data to the backend PHP for processing.

In PHP, we can get these values ​​through the $_POST array. The sample code is as follows:

$username = $_POST['username'];
$age = $_POST['age'];

3. Use Cookie to pass

In addition to form submission and AJAX technology, Cookies can also be used to pass JavaScript values. Cookies are a mechanism for storing data on the client side and passing data between the front-end and back-end. The sample code is as follows:

<script>
  var username = '张三';
  var age = 18;

  document.cookie = 'username=' + username;
  document.cookie = 'age=' + age;
</script>

In this example, we use JavaScript's document.cookie attribute to set the Cookie value. The way to set a cookie is to connect the value and name with an equal sign, and then use semicolons and spaces to separate multiple key-value pairs. In this example, we set the username and age values ​​as cookie values.

In PHP, we can use the $_COOKIE array to get these values. The sample code is as follows:

$username = $_COOKIE['username'];
$age = $_COOKIE['age'];

It should be noted that when using Cookie to transfer values, you need to ensure that the Cookie can be transferred correctly between the front end and the back end. Especially when crossing requests, you may encounter some security issues, and you need to use cookie attributes such as HttpOnly to ensure the security of cookie delivery.

Summary:

This article introduces three methods of assigning JavaScript values ​​​​to PHP: form submission, AJAX technology and Cookie delivery. In actual development, according to different needs, different methods can be selected for data transfer to achieve front-end and back-end data interaction.

The above is the detailed content of How to assign javascript value to PHP. For more information, please follow other related articles on the PHP Chinese website!