Biểu mẫu HTML thực hiện một số "hành động" khi nhấn nút gửi

Tôi muốn tìm hiểu về các biểu mẫu HTML. Ví dụ, tôi có 2 trường nhập văn bản cho tên và họ và nút gửi. Khi nhấn nút gửi, tôi muốn trang web hiển thị nội dung như: Tên của bạn là "Tên" "Họ".Biểu mẫu HTML thực hiện một số "hành động" khi nhấn nút gửi

<!DOCTYPE html> 
<html> 
    <body> 
     <form> 
     First name: <input type="text" name="firstname" /><br /> 
     Last name: <input type="text" name="lastname" /><br /> 
     <input type="submit" value="Submit" /> 
     </form> 
    </body> 
</html>

Tôi cần gì ở đây để có một số "hành động" khi tôi nhấp vào nút đó?

Chỉnh sửa: Ok bây giờ tôi tìm ra rằng tôi cần PHP hoặc JavaScript tại đây. Có thể một số đề nghị hoặc cung cấp một mã mẫu của PHP hoặc Js như một tài liệu tham khảo cho tôi?

Nguồn

2012-06-12 Ronaldinho Learn Coding

của bạn ''

ok, nhờ tôi sẽ nghiên cứu về nó. –

Ok, tôi sẽ thực hiện việc này. Nếu bạn muốn làm việc với PHP, bạn sẽ cần cài đặt và cấu hình cả PHP và máy chủ web trên máy của bạn. Bài viết này có thể giúp bạn bắt đầu: PHP Manual: Installation on Windows systems

Khi bạn đã thiết lập môi trường, bạn có thể bắt đầu làm việc với biểu mẫu web. Trực tiếp từ bài viết: Processing form data with PHP:

Ví dụ này, bạn sẽ cần phải tạo hai trang. Trên trang đầu tiên , chúng tôi sẽ tạo một biểu mẫu HTML đơn giản để thu thập một số dữ liệu. Dưới đây là một dụ:
<html> 
<head> 
<title>Test Page</title> 
</head> 
<body> 
    <h2>Data Collection</h2><p> 
    <form action="process.php" method="post"> 
     <table> 
      <tr> 
       <td>Name:</td> 
       <td><input type="text" name="Name"/></td> 
      </tr> 
      <tr> 
       <td>Age:</td> 
       <td><input type="text" name="Age"/></td> 
      </tr> 
      <tr> 
       <td colspan="2" align="center"> 
       <input type="submit"/> 
       </td> 
      </tr> 
     </table> 
    </form> 
</body> 
</html> 
Trang này sẽ gửi dữ liệu Tên và Tuổi đến process.php trang. Bây giờ cho phép tạo process.php để sử dụng dữ liệu từ dạng HTML mà chúng ta thực hiện:

<?php 
    print "Your name is ". $Name; 
    print "<br />"; 
    print "You are ". $Age . " years old"; 
    print "<br />"; $old = 25 + $Age; 
    print "In 25 years you will be " . $old . " years old"; 
?>

Như bạn có thể biết, nếu bạn bỏ qua các method = "post" một phần của hình thức , URL có hiển thị dữ liệu. Ví dụ: nếu tên của bạn là Bill Jones và bạn là 35 tuổi, trang process.php của chúng tôi sẽ hiển thị là http://yoursite.com/process.php?Name=Bill+Jones&Age=35 Nếu bạn muốn, bạn có thể thay đổi URL theo cách này và đầu ra sẽ thay đổi .

Javascript bổ sung Ví dụ

dụ tập tin duy nhất này có html từ câu hỏi của bạn và gắn sự kiện onSubmit của mẫu để hàm JavaScript kéo các giá trị của 2 textbox và hiển thị chúng trong một hộp cảnh báo.

Note: document.getElementById("fname").value được đối tượng với thẻ ID rằng bằng fname và sau đó kéo nó value - mà trong trường hợp này là nội dung trong hộp văn bản First Name.

<html> 
    <head> 
    <script type="text/javascript"> 
    function ExampleJS(){ 
     var jFirst = document.getElementById("fname").value; 
     var jLast = document.getElementById("lname").value; 
     alert("Your name is: " + jFirst + " " + jLast); 
    } 
    </script> 

    </head> 
    <body> 
     <FORM NAME="myform" onSubmit="JavaScript:ExampleJS()"> 

      First name: <input type="text" id="fname" name="firstname" /><br /> 
      Last name: <input type="text" id="lname" name="lastname" /><br /> 
      <input name="Submit" type="submit" value="Update" /> 
     </FORM> 
    </body> 
</html>

Nguồn

2012-06-13 00:31:09 xelco52

Xin chào! Cảm ơn bạn! Lời giải thích rất hay! Tôi có sẵn máy chủ web và máy chủ web trực tuyến. Tôi sẽ đọc và thử sự giúp đỡ của bạn. Chỉ cần bạn kiểm tra lại ở đây và giúp tôi nhiều hơn :) –

Tôi đã có ý tưởng với PHP, trong trường hợp này tôi có thể muốn một cái gì đó đơn giản hơn chỉ như một tệp HTML, vì vậy tôi biết tôi phải có một số chức năng JavaScript trên thẻ , bạn có thể giúp tôi không? –

Đã thêm ví dụ JS vào cuối câu trả lời của tôi – xelco52

chỉ mục.html

<!DOCTYPE html> 
<html> 
    <body> 
     <form action="submit.php" method="POST"> 
     First name: <input type="text" name="firstname" /><br /><br /> 
     Last name: <input type="text" name="lastname" /><br /> 
     <input type="submit" value="Submit" /> 
     </form> 
    </body> 
</html>

Sau đó thêm một tập tin mà trang web mà bạn muốn hiển thị sau khi nhấn nút gửi

submit.php

<html> 
    <body> 

    Your First Name is - <?php echo $_POST["firstname"]; ?><br> 
    Your Last Name is - <?php echo $_POST["lastname"]; ?> 

    </body> 
</html>

Nguồn

2015-10-30 06:07:46

Biểu mẫu HTML thực hiện một số "hành động" khi nhấn nút gửi

Trả lời

Các vấn đề liên quan