Tôi cần lưu trữ dữ liệu biểu mẫu cục bộ từ trang này sang trang khác trong bảng bằng JavaScript?
Mã JavaScript là
function addtext[]
{
var fname = document.myform.first_name.value;
var lname = document.myform.last_name.value;
var email = document.myform.email.value;
document.writeln["Thank you! You have just entered the following:"];
document.writeln[""];
document.writeln["First Name : " + fname];
document.writeln["Last Name : " + lname];
document.writeln["Email Address : " + email];
}
Phần HTML là
First Name
Last Name
Email Address
Đã hỏi ngày 17 tháng 12 năm 2013 lúc 5:57Dec 17, 2013 at 5:57
Bzbzbzbzbzbz
1823 Huy hiệu bạc13 Huy hiệu đồng3 silver badges13 bronze badges
Kiểm tra JSFiddle! đính kèm. Hy vọng nó sẽ giúp bạn.
var fname = document.myform.first_name.value;
var lname = document.myform.last_name.value;
var email = document.myform.email.value;
document.writeln["Thank you! You have just entered the following:"];
document.writeln[""];
document.writeln["First Name : " + fname];
document.writeln["Last Name : " + lname];
document.writeln["Email Address : " + email];
Đã trả lời ngày 30 tháng 12 năm 2013 lúc 7:20Dec 30, 2013 at 7:20
AwaawaAWA
3031 Huy hiệu vàng2 Huy hiệu bạc11 Huy hiệu đồng1 gold badge2 silver badges11 bronze badges
Tại sao bạn muốn làm điều này? Bất kỳ lý do đặc biệt? Mặc dù vậy, không phải là thực hành tốt nhất nhưng nếu sở thích người dùng duy nhất của nó không phải là dữ liệu người dùng thì thông qua JavaScript, bạn có thể thực hiện thông qua SessionStore hoặc LocalStorage.
Xem lưu trữ web
Hoặc nếu cookie ổn thì hãy sử dụng cookie jQuery
//github.com/carhartl/jquery-cookie
Đã trả lời ngày 17 tháng 12 năm 2013 lúc 6:01Dec 17, 2013 at 6:01
Raunak Kathuriaraunak KathuriaRaunak Kathuria
3.1051 Huy hiệu vàng17 Huy hiệu bạc25 Huy hiệu Đồng1 gold badge17 silver badges25 bronze badges
Lưu trữ dữ liệu trong trình duyệt với JavaScript.
setItem [khóa, giá trị] Lưu trữ khóa/giá trị ..
getItem [khóa] nhận được giá trị theo khóa ..
- RemoveItem [khóa] Xóa khóa và giá trị ..
- Rõ ràng [] Xóa mọi thứ khỏi lưu trữ ..
- khóa [chỉ mục] Nhận khóa từ một vị trí nhất định ..
Chiều dài số lượng các mặt hàng được lưu trữ ..
It was a entry level role so the interviewer asked me to create a table and show the details that are submitted by the user in a table format.
Junaid
Đăng vào ngày 25 tháng 7 năm 2021 • Cập nhật vào ngày 28 tháng 8 năm 2021
The things that you have to do include:-
- Bài viết này sẽ tập trung vào:-
- Cách lấy dữ liệu từ thẻ đầu vào
- Cách hiển thị dữ liệu đó cho người dùng trên cùng một trang web bằng JS
Làm thế nào để làm tất cả những điều trên trên biểu mẫu gửi.
Email
Age
State
Submit
- Name
- Age
- State
Nhập chế độ FullScreenen EXIT Mode FullScreen
Này tất cả mọi người, vì vậy câu hỏi này đã được hỏi tôi trong một cuộc phỏng vấn gần đây cho vai trò trước mà tôi đã nộp đơn. Đó là một vai trò cấp nhập cảnh vì vậy người phỏng vấn đã yêu cầu tôi tạo một bảng và hiển thị các chi tiết được gửi bởi người dùng ở định dạng bảng.
- Vậy hãy bắt đầu
- Điều đầu tiên bạn cần hiểu là tuyên bố vấn đề trong tay. Những điều bạn phải làm bao gồm:-
- Tạo một biểu mẫu bằng HTML & CSS.
Chúng ta có thể cải thiện giao diện của hình thức bằng cách sử dụng một số CSS
form{
display:flex;
flex-direction:column;
width:35vw;
}
form input{
padding:0.7em 1em;
}
form span{
padding:0.6em 1em;
}
form > button{
padding:1.1em;
margin:1em 1em;
cursor:pointer;
}
ul{
list-style:none;
display:grid;
grid-template-columns:1fr 1fr 1fr;
justify-content:center;
width:25vw;
}
ul li{
padding:1em 2em .8em 2em;
border:1px solid black;
}
Nhập chế độ FullScreenen EXIT Mode FullScreen
Vì vậy, kiểu dáng được thực hiện bây giờ là phần JavaScript.
Now comes the javascript part.
Vì vậy, những điều bạn cần làm trong JavaScript bao gồm *Nhận tài liệu tham khảo cho tất cả các đầu vào cũng như cho biểu mẫu.
*Get references for all the inputs as well as for the form.
- Đặt trình nghe sự kiện cho sự kiện gửi biểu mẫu.submit event of the form.
- Và sau đó lấy các giá trị một sự kiện được kích hoạt và hiển thị nó với giao diện người dùng. Vậy hãy bắt đầu.
let form=document.getElementById["formSubmission"];
let table=document.getElementById['data'];
form.addEventListener["submit",[e]=>{
e.preventDefault[];
submit[];
}]
const submit=[]=>{
let name = document.getElementById["name"].value;
let age = document.getElementById["age"].value;
let state = document.getElementById["state"].value;
let newArray = [name,age,state];
newArray.forEach[[item]=>{
var li = document.createElement["li"];
var text = document.createTextNode[item];
li.appendChild[text];
table.appendChild[li];
}]
form.reset[];
}
Nhập chế độ FullScreenen EXIT Mode FullScreen
- Vì vậy, kiểu dáng được thực hiện bây giờ là phần JavaScript.
- Vì vậy, những điều bạn cần làm trong JavaScript bao gồm *Nhận tài liệu tham khảo cho tất cả các đầu vào cũng như cho biểu mẫu.
- Đặt trình nghe sự kiện cho sự kiện gửi biểu mẫu.
- Và sau đó lấy các giá trị một sự kiện được kích hoạt và hiển thị nó với giao diện người dùng. Vậy hãy bắt đầu.
- Ở đây bạn có thể thấy chúng tôi có tham chiếu đến biểu mẫu và bảng của chúng tôi trước.li
- Sau đó, chúng tôi đã thêm trình nghe sự kiện để nhận sự kiện gửi và bất cứ khi nào điều đó xảy ra, hãy gọi chức năng ** của chúng tôi **.
- Sau đó, chúng tôi tiếp tục và nối nút văn bản vào LI của chúng tôi mà chúng tôi vừa tạo
- Sau đó, chúng tôi nối LI vào bảng của chúng tôi.
Điều này xảy ra cho tất cả các đầu vào và sau khi thực hiện, biểu mẫu sẽ được đặt lại bằng phương thức .Reset [] đã tồn tại
Và kết quả cuối cùng sẽ trông như thế này
À chính nó đấy. Tôi chắc chắn sẽ có nhiều cách tốt hơn để làm điều đó. Nếu bạn biết bất kỳ bình luận nào khác dưới đây để cho tôi biết.
I am
sure there will be many more better ways of doing it.
If you know any other do comment below to let me know.
Thanks.
Muốn khuyến khích tôi tạo những bài đăng như thế này nhiều hơn hãy mua cho tôi một ly cà phê
Buy me a coffee