Hướng dẫn how do i transfer data from one html page to another using jquery? - làm cách nào để chuyển dữ liệu từ trang html này sang trang html khác bằng jquery?

35

Mới! Lưu câu hỏi hoặc câu trả lời và sắp xếp nội dung yêu thích của bạn. Tìm hiểu thêm.
Learn more.

Tôi chưa quen với HTML và JavaScript, những gì tôi đang cố gắng làm là từ một tệp HTML mà tôi muốn trích xuất những thứ đặt ở đó và hiển thị nó cho một tệp HTML khác thông qua JavaScript.

Đây là những gì tôi đã làm cho đến nay để kiểm tra nó: kiểm tra.html
testing.html

   





name:

 Print 

next.html

   






    

        
test
    

asd.js

function testJS()
{

var b = document.getElementById('name').value

document.getElementById('here').innerHTML = b;

}

function testJS()
{

var b = document.getElementById('name').value

document.getElementById('here').innerHTML = b;

}

function testJS()
{

var b = document.getElementById('name').value

document.getElementById('here').innerHTML = b;

}

Đã hỏi ngày 6 tháng 7 năm 2013 lúc 10:36Jul 6, 2013 at 10:36

5

Hãy thử mã này: Trong thử nghiệm.html

function testJS() {
    var b = document.getElementById('name').value,
        url = 'http://path_to_your_html_files/next.html?name=' + encodeURIComponent(b);

    document.location.href = url;
}

Và trong Next.html:

window.onload = function () {
    var url = document.location.href,
        params = url.split('?')[1].split('&'),
        data = {}, tmp;
    for (var i = 0, l = params.length; i < l; i++) {
         tmp = params[i].split('=');
         data[tmp[0]] = tmp[1];
    }
    document.getElementById('here').innerHTML = data.name;
}

Mô tả: JavaScript không thể chia sẻ dữ liệu giữa các trang khác nhau và chúng ta phải sử dụng một số giải pháp, ví dụ: URL Nhận các params (trong mã của tôi, tôi đã sử dụng theo cách này), cookie, localStorage, v.v.

PS. Tôi là một người nói tiếng Anh không bản địa, bạn sẽ vui lòng sửa tin của tôi, nếu cần thiết

Đã trả lời ngày 6 tháng 7 năm 2013 lúc 10:49Jul 6, 2013 at 10:49

3

Cách thức cũ để thiết lập một biến toàn cầu tồn tại giữa các trang là đặt dữ liệu trong cookie. Cách hiện đại là sử dụng lưu trữ cục bộ, có hỗ trợ trình duyệt tốt (IE8+, Firefox 3.5+, Chrome 4+, Android 2+, iPhone 2+). Sử dụng LocalStorage dễ dàng như sử dụng một mảng:

localStorage["key"] = value;

... in another page ...
value = localStorage["key"];

Bạn cũng có thể đính kèm trình xử lý sự kiện để lắng nghe các thay đổi, mặc dù API sự kiện hơi khác nhau giữa các trình duyệt. Thêm về chủ đề.

Đã trả lời ngày 6 tháng 7 năm 2013 lúc 10:46Jul 6, 2013 at 10:46

Nói dối Ryanlie RyanLie Ryan

60K13 Huy hiệu vàng95 Huy hiệu bạc141 Huy hiệu Đồng13 gold badges95 silver badges141 bronze badges

3

Giả sử bạn đang nói về JS này trong môi trường trình duyệt (không giống như những người khác như Nodejs), thật không may, tôi nghĩ rằng những gì bạn đang cố gắng làm không thể đơn giản vì đây không phải là cách nó được cho là hoạt động.

Các trang HTML được gửi đến trình duyệt thông qua giao thức HTTP, đây là giao thức 'không trạng thái'. Nếu bạn vẫn cần truyền các giá trị ở giữa các trang, có thể có 3 cách tiếp cận:

1. Cookie phiên
2. HTML5 LocalStorage
3. Đăng biến trong URL và truy xuất chúng trong Next.html qua đối tượng

   function testJS()
   {
   
   var b = document.getElementById('name').value
   
   document.getElementById('here').innerHTML = b;
   
   }
   

   3

Đã trả lời ngày 6 tháng 7 năm 2013 lúc 10:52Jul 6, 2013 at 10:52

ShreyasthreyasShreyas

3673 Huy hiệu bạc9 Huy hiệu Đồng3 silver badges9 bronze badges

3

Với lớp JavaScript LocalStorage, bạn có thể sử dụng lưu trữ cục bộ mặc định của trình duyệt của mình để lưu (khóa, giá trị) và sau đó truy xuất các giá trị này trên bất kỳ trang nào bạn cần bằng khóa. Ví dụ - pageOne.html -localStorage class, you can use the default local storage of your browser to save (key,value) pairs and then retrieve these values on whichever page you need using the key. Example - Pageone.html -

Pagetwo.html -

Đã trả lời ngày 1 tháng 7 năm 2018 lúc 10:57Jul 1, 2018 at 10:57

0

Tôi sử dụng điều này để đặt hình ảnh hồ sơ trên mỗi trang.

Trên trang đầu tiên đặt giá trị như:

localStorage.setItem("imageurl", "ur image url");

hoặc trên trang thứ hai nhận được giá trị như:

var imageurl=localStorage.getItem("imageurl");
document.getElementById("profilePic").src = (imageurl);

Đã trả lời ngày 23 tháng 10 năm 2018 lúc 8:55Oct 23, 2018 at 8:55

Bạn có thể chỉ cần gửi dữ liệu bằng cách sử dụng

function testJS()
{

var b = document.getElementById('name').value

document.getElementById('here').innerHTML = b;

}

function testJS()
{

var b = document.getElementById('name').value

document.getElementById('here').innerHTML = b;

}

   






    

        
test
    

Điều này đang gửi qua một yêu cầu nhận

Đã trả lời ngày 27 tháng 8 năm 2014 lúc 18:16Aug 27, 2014 at 18:16

Xin chào, tôi sẽ để lại điều này ở đây cz tôi không thể bình luận do hạn chế nhưng tôi thấy câu trả lời của Alexfitiskin hoàn hảo, nhưng cần một sự điều chỉnh nhỏ

   






    

        
test
    

Điều này cần phải được thay đổi thành

   






    

        
test
    

Tôi biết rằng sau năm năm, chủ sở hữu của bài đăng sẽ không tìm thấy nó có tầm quan trọng nào nhưng đây là dành cho những người có thể gặp trong tương lai.

Đã trả lời ngày 22 tháng 7 năm 2018 lúc 17:32Jul 22, 2018 at 17:32

   






    

        
test
    

Kịch bản phía khách hàng

   






    

        
test
    

JQuery là một thư viện JS và nó đơn giản hóa chương trình của nó. Vì vậy, tôi khuyên bạn nên sử dụng JQuery Rathar sau đó JS. Ở đây tôi chỉ lấy giá trị của elemnt đầu vào (id = name) trên nút gửi nhấp vào sự kiện, sau đó tải trang mong muốn (next.html), nếu hàm tải thực hiện thành công, tôi sẽ gọi một hàm sẽ đặt dữ liệu ở vị trí mong muốn.

Chức năng tải jquery http://api.jquery.com/load/

Đã trả lời ngày 6 tháng 7 năm 2013 lúc 12:07Jul 6, 2013 at 12:07

myk.myk.myk.

3231 Huy hiệu bạc5 Huy hiệu đồng1 silver badge5 bronze badges

Sau đây là mã mẫu để truyền các giá trị từ trang này sang trang khác bằng HTML. Ở đây, dữ liệu từ Trang1 được chuyển sang Trang2 và nó được truy xuất bằng cách sử dụng JavaScript.

1) Trang1.html

   






    

        
test
    

2) Trang2.html

   






    

        
test
    

Đã trả lời ngày 1 tháng 7 năm 2018 lúc 13:00Jul 1, 2018 at 13:00

CodemakerCodemakerCodemaker

9.5933 huy hiệu vàng69 Huy hiệu bạc61 Huy hiệu đồng3 gold badges69 silver badges61 bronze badges

1

Tôi đã mã hóa các câu trả lời từ Alex Fitiskin và thêm một chút mã. Tôi đã thêm một tham số vào hàm onload để nhận sự kiện gửi biểu mẫu và ngăn chặn hành vi mặc định của nó trước tiên.

Đây là mã:

test.html

   






    

        
test
    

next.html

   






    

        
test
    

test.js

   






    

        
test
    

Bằng cách này, hàm onload sẽ được thay thế bằng hàm onload tùy chỉnh và biểu mẫu sẽ không được gửi theo cách mặc định, mà thay vào đó sử dụng mã bên trong chức năng TestJS.

Đã trả lời ngày 23 tháng 3 lúc 16:49Mar 23 at 16:49

Tránh sử dụng địa phương vì dữ liệu không an toàn với phương thức GET. Tùy chọn tốt nhất là sử dụng tập lệnh được đặt thành mô -đun và sau đó xuất & nhập dữ liệu qua 2 tệp JS sang tệp HTML. Giá trị biến có thể được truyền giữa các trang bằng phương pháp mô -đun.

Đã trả lời ngày 15 tháng 6 lúc 9:18Jun 15 at 9:18

Làm cách nào để lấy dữ liệu từ trang HTML này sang trang khác bằng cách sử dụng jQuery?

Làm cách nào để chuyển dữ liệu từ trang HTML này sang trang khác trong HTML?

Làm cách nào để hiển thị nội dung của một trang HTML trong một trang khác?

Làm thế nào để bạn chuyển dữ liệu JSON từ trang HTML này sang trang khác?