Hướng dẫn về jQuery get. Ở đây chúng ta thảo luận về Cách hoạt động của phương thức trong jQuery và Ví dụ cùng với các mã và kết quả đầu ra một cách chi tiết.

Bạn đang xem : ví dụ về phương thức jquery get

jQuery get

Giới thiệu về jQuery get

Trong JQuery, get () được định nghĩa là một trong những phương thức trong jquery, nó được sử dụng để gửi yêu cầu http GET đến máy chủ với sự trợ giúp của định dạng không đồng bộ không chỉ để gửi mà nó còn được sử dụng để truy xuất dữ liệu từ máy chủ cơ sở dữ liệu bất cứ khi nào yêu cầu của người dùng được gửi đến máy chủ, dữ liệu ở định dạng chuỗi truy vấn, dữ liệu được mã hóa một và phương thức được gọi sau hàm gọi lại nếu yêu cầu của người dùng thành công, phương thức get () sẽ chuyển url, loại dữ liệu và cuộc gọi lại đối tượng XMLHttpRequest được trả về từ phương thức get ().

Cú pháp

Bắt đầu khóa học phát triển phần mềm miễn phí của bạn

Phát triển web, ngôn ngữ lập trình, Kiểm tra phần mềm & amp; những người khác

Trong javascript, thư viện jquery sử dụng một tập hợp các phương thức tích hợp khác để tương tác với người dùng trong ứng dụng web. Phương thức jquery get () đang tương tác với các phần tử html để tùy chỉnh các trang web. Nó có cú pháp riêng và một tập hợp các tham số sẽ được chuyển và trả về yêu cầu ở định dạng XMLHttpRequest.

& lt; html & gt;
& lt; đầu & gt;
& lt; script type = ”text / JavaScript” src = https: //ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js>
& lt; / script & gt;
& lt; script type = ”text / javascript” & gt;
$ (tài liệu) .ready (function () {
$ (“# Tên biến”). Nhấp vào (hàm (sự kiện)
{
$ .get (“tệp chương trình phụ trợ có phần mở rộng”, một số dữ liệu, [hàm gọi lại], [loại]);
- một số mã jquery ---
});
});
& lt; / script & gt;
& lt; body & gt;
- một số thẻ dựa trên giao diện người dùng html elemenst ---
& lt; / body & gt;
& lt; / html & gt;

Phương thức get hoạt động như thế nào trong jQuery?

jquery là thư viện javascript; nó có thể được sử dụng để tương tác với các trang web phức tạp hơn. Sử dụng jquery, nó có các phương thức mặc định và các thuộc tính sẽ cần nhiều hơn cho các yêu cầu ứng dụng web; dựa trên đó, phương thức get () được sử dụng để gửi dữ liệu bằng định dạng không đồng bộ tới máy chủ. Với sự trợ giúp của các tham số mặc định như URL, dữ liệu và các loại hàm gọi lại, nó sẽ được chuyển tới các mã phụ trợ.

Đối tượng XMLHttpRequest là kiểu trả về của phương thức get (). Các jquery phải đặt các phương thức Ajax mặc định để gửi yêu cầu và nhận phản hồi của máy chủ như đối tượng XMLHttpRequest đang trả về các giá trị. Đối tượng XHR của jqueries hoặc jqXHR sẽ được trả về một số giao diện với sự trợ giúp của các thuộc tính, phương thức và hành vi của nó đối với các chức năng.

jQuery.get (url, [data], [callback], [type]) là cú pháp và tham số chung sẽ được sử dụng để gửi dữ liệu không đồng bộ đến máy chủ, trong khi url được biểu thị bằng bất kỳ chuỗi nào chứa URL mà yêu cầu cụ thể được gửi đến máy chủ, dữ liệu là dữ liệu bổ sung và các thông số tùy chọn của nó đại diện cho các cặp khóa / giá trị mà kết quả được máy chủ phản hồi.

Dữ liệu yêu cầu là bất kỳ các kiểu dữ liệu như số nguyên, chuỗi, v.v., sẽ là số nhận dạng duy nhất nếu phương thức được sử dụng cho các cặp dữ liệu khóa / giá trị. Đối với kết quả, đối tượng XMLHttpRequest là kiểu trả về của phương thức get (), sau đó tham số “type” chủ yếu được biểu diễn bằng cách sử dụng các kiểu dữ liệu sẽ được trả về sau các hàm gọi lại như các hàm do người dùng định nghĩa, được yêu cầu trong các sự kiện đã được gọi với sự trợ giúp của tham số gọi lại trong phương thức get ().

Xem Thêm  Cách tạo và sử dụng Pattern trong Photoshop - cách dùng ffmpeg

Các ví dụ về jQuery get

Dưới đây là các ví dụ về jQuery get được đề cập đến:

Ví dụ # 1

Mã:

& lt; html & gt;
& lt; đầu & gt;
& lt; title & gt; Ví dụ về jQuery & lt; / title & gt;
& lt; script type = "text / javascript"
src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
& lt; / script & gt;
& lt; script type = "text / javascript" language = "javascript" & gt;
$ (tài liệu) .ready (function () {
$ ("# example"). nhấp vào (chức năng (sự kiện) {
$ .get (
"index.php",
{name: 'Sivaraman',
thành phố: "Tiruppur",
di động: "8220244056"
},
hàm (dữ liệu) {
$ ('# demo'). html (dữ liệu);
}
);
});
$ ("# example1"). nhấp vào (chức năng (sự kiện) {
$ .get (
"index1.php",
{name: 'Sivaraman',
thành phố: "Tiruppur",
di động: "8220244056"
},
hàm (dữ liệu) {
$ ('# demo1'). html (datas);
}
);
});
});
& lt; / script & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; p & gt; Chào mừng đến với Miền của tôi & lt; / p & gt;
& lt; span id = "demo" style = "background-color: red;" & gt;
Vui lòng nhấp vào nút để nhận dữ liệu đã lưu của bạn
& lt; / span & gt;
& lt; span id = "demo1" style = "background-color: blue;" & gt;
Dữ liệu đã truy xuất của bạn
& lt; / span & gt;
& lt; div & gt; & lt; input type = "button" id = "example"
value = "Chào mừng người dùng" / & gt; & lt; / div & gt;
& lt; div & gt; & lt; input type = "button" id = "example1"
value = "Truy xuất" / & gt; & lt; / div & gt;
& lt; / body & gt;
& lt; / html & gt;
& lt;? php
$ _REQUEST ["name"] = "Sivaraman";
$ _REQUEST ["city"] = "Tup";
$ _REQUEST ["mobile"] = "8220244056";
echo "Cảm ơn bạn đã lưu trữ thông tin chi tiết. Vui lòng nhấp vào nút Truy xuất để kiểm tra dữ liệu đã lưu trữ của bạn";
? & gt;
& lt;? php
chuyển đổi ($ _REQUEST) {
trường hợp 1: $ _ REQUEST ["name"] = "Sivaraman";
echo "tên";
phá vỡ;
trường hợp 2: $ _ REQUEST ["city"] = "TUP";
echo "thành phố";
phá vỡ;
trường hợp 3: $ _ REQUEST ["mobile"] = "822027689";
echo "điện thoại di động";
phá vỡ;
mặc định:
echo "không";
}
? & gt;

Đầu ra:

jQuery nhận đầu ra 1

Ví dụ # 2

Mã:

& lt; html & gt;
& lt; đầu & gt;
& lt; script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" & gt; & lt; / script & gt;
& lt; script & gt;
$ (tài liệu) .ready (function () {
$ ("nút"). nhấp vào (function () {
$ .get ("index1.php",
{name: 'Sivaraman',
thành phố: "Tiruppur",
di động: "8220244056",
},
chức năng (tên, thành phố, điện thoại di động) {
alert ("Sivaraman:" + name + "\ n Tiriuppur:" + city + "\ n 86536768:" + mobile);
});
});
});
& lt; / script & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; nút & gt; Vui lòng nhấp vào nút để nhận phản hồi từ máy chủ của chúng tôi & lt; / button & gt;
& lt; / body & gt;
& lt; / html & gt;

Đầu ra:

jQuery lấy đầu ra 2

Ví dụ # 3

Mã:

& lt;! DOCTYPE html & gt;
& lt; html lang = "vi" & gt;
& lt; đầu & gt;
& lt; meta charset = "utf-8" & gt;
& lt; title & gt; Chào mừng Người dùng Lấy Ngày và Giờ Hiện tại & lt; / title & gt;
& lt; script src = "https://code.jquery.com/jquery-3.5.1.min.js" & gt; & lt; / script & gt;
& lt; script & gt;
$ (tài liệu) .ready (function () {
$ ("# btn1"). nhấp vào (function () {
$ .get ("index1.php", hàm (dữ liệu) {
$ ("# demo"). html (dữ liệu);
});
});
$ ("# frm"). submit (function (event) {
event.preventDefault ();
$ .get ("index1.php", hàm (dữ liệu) {
$ ("# demo1"). html (dữ liệu);
});
});
});
& lt; / script & gt;
& lt; / head & gt;
& lt; body & gt;
& lt; div id = "demo" & gt;
& lt; h2 & gt; Chào mừng Bạn đến với Miền của Tôi & lt; / h2 & gt;
& lt; / div & gt;
& lt; button type = "button" id = "btn1" & gt; Nhấp vào Nút để xem ngày hôm nay với thời gian & lt; / button & gt; & lt; br / & gt; & lt; br / & gt;
& lt; form action = "index.php" Ide = "frm" & gt;
& lt; label & gt; Name: & lt; input type = "text" name = "name" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; City: & lt; input type = "text" name = "city" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; nhãn & gt; Địa chỉ: & lt; input type = "text" name = "address" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; Mobile: & lt; input type = "text" name = "mobile" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; State: & lt; input type = "text" name = "state" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; Country: & lt; input type = "text" name = "country" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; Pincode: & lt; input type = "text" name = "pincode" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; Email: & lt; input type = "text" name = "email" & gt; & lt; / label & gt; & lt; br / & gt; & lt; br / & gt;
& lt; label & gt; Comment: & lt; textarea cols = "50" name = "comment" & gt; & lt; / textarea & gt; & lt; / label & gt;
& lt; input type = "submit" value = "submit" & gt;
& lt; / form & gt;
& lt; div id = "demo1" & gt; & lt; / div & gt;
& lt; / body & gt;
& lt; / html & gt;
& lt;? php
$ name = htmlspecialchars ($ _ GET ["name"]);
$ city = htmlspecialchars ($ _ GET ["city"]);
$ mobile = htmlspecialchars ($ _ GET ["mobile"]);
$ address = htmlspecialchars ($ _ GET ["address"]);
$ state = htmlspecialchars ($ _ GET ["state"]);
$ pincode = htmlspecialchars ($ _ NHẬN ["mã pin"]);
$ country = htmlspecialchars ($ _ GET ["country"]);
$ email = htmlspecialchars ($ _ GET ["email"]);
$ comment = htmlspecialchars ($ _ GET ["comment"]);
echo "Xin chào, $ name. Nhận xét của bạn đã được gửi thành công. Cảm ơn bạn đã đăng ký". "";
echo "Vui lòng xem nhận xét mới nhất của bạn: $ comment";
? & gt;

Đầu ra:

Xem Thêm  2 cách xóa thuộc tính khỏi đối tượng trong JavaScript - javascript xóa thuộc tính khỏi đối tượng

output 3

Trong các ví dụ trên, chúng tôi đã sử dụng phương thức get () trong các lĩnh vực khác nhau vì nó sẽ tìm nạp dữ liệu giao diện người dùng bằng một số công nghệ như AJAX. Khi chúng tôi sử dụng ajax, nó sẽ truy xuất dữ liệu mà không cần làm mới trang hoặc tải lại trang. Nhưng ở đây, chúng tôi đã sử dụng mà không có ajax; chúng tôi chỉ cần lưu trữ dữ liệu giao diện người dùng và truy xuất dữ liệu bằng phương thức get () với các tham số chính thức.

Kết luận

Trong jQuery, chúng ta có rất nhiều phương thức được xác định trước với các thuộc tính. Khi chúng ta sử dụng các phương pháp trong các ứng dụng dựa trên web, đồng thời, trình duyệt của người dùng cũng tránh được các hạn chế bảo mật như tường lửa hoặc một số biện pháp bảo vệ trang mạng nội bộ khác. Đôi khi jquery.get () sẽ tạo ra các lỗi như lỗi thời gian biên dịch và thời gian chạy; với sự trợ giúp của bảng điều khiển web, chúng tôi sẽ khắc phục các lỗi.

Các bài báo được đề xuất

Đây là hướng dẫn về jQuery get. Ở đây chúng ta thảo luận về Cách lấy phương thức hoạt động trong jQuery và Ví dụ cùng với các mã và kết quả đầu ra. Bạn cũng có thể xem các bài viết sau để tìm hiểu thêm –

0

Chia sẻ

Chia sẻ


Xem thêm những thông tin liên quan đến chủ đề ví dụ về phương thức jquery get

jquery ajax get function

alt

  • Tác giả: kudvenkat
  • Ngày đăng: 2015-06-01
  • Đánh giá: 4 ⭐ ( 9769 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Link for all dot net and sql server video tutorial playlists
    https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1

    Link for slides, code samples and text version of the video
    http://csharp-video-tutorials.blogspot.com/2015/06/jquery-ajax-get-function.html

    Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.
    https://www.youtube.com/channel/UC7sEwIXM_YfAMyonQCrGfWA/?sub_confirmation=1

    In this video we will discuss
    1. How to make a GET request using jQuery AJAX get function
    2. Difference between jQuery get and load functions

    We discussed how to make AJAX requests using jQuery load() function in Part 53 and Part 54. Let us rewrite the example we worked with in Part 54, using jQuery AJAX get() function.

    Please change the following jquery code in HtmlPage1.html

    $(” + helpDiv + ‘HelpDiv’).load(‘GetHelpText.aspx’, { HelpTextKey: helpDiv });

    AS SHOWN BELOW

    $.get(‘GetHelpText.aspx’, { HelpTextKey: helpDiv }, function (response) {
    $(” + helpDiv + ‘HelpDiv’).html(response);
    });

    What is the difference between jQuery get and load functions
    1. jQuery load function can be used to load only the HTML data from the server, where as jquery get function can be used to load any type of data (xml, json, script, or html).

    2. jQuery load function may issue a get or post request depending on whether the data parameter is specified or not. POST method is used if data is provided, otherwise, GET is used. On the other hand jquery get method always issues a GET request.

    3. With load function we specify a selector first. The HTML content retrieved from the server is automatically inserted into the DOM elements matched by the selector.
    $(‘selector’).load(‘url’, ‘data’);

    With get function we do not specify any selector first, instead we will make use of the callback function to insert the data received from the server into the DOM elements.

    $.get(‘url’, ‘data’, function (response) {
    $(‘selector’).html(response);
    });

    In our next video, we will discuss how to load json data from the server using jquery get function.

jQuery: AJAX sử dụng jQuery

  • Tác giả: v1study.com
  • Đánh giá: 4 ⭐ ( 9329 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: AJAX bao gồm các ký tự viết tắt của cụm từ tiếng Anh: Asynchronous JavaScript And XML (tạm dịch là: JavaScript và XML không đồng bộ), là bộ công cụ cho phé

Phương thức GET trong Jquery

  • Tác giả: 123code.net
  • Đánh giá: 5 ⭐ ( 2903 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Ở các bài trước mình đã nói sơ qua về khái niệm, demo và một số ứng dụng của nó. Bài viết này mình sẽ hướng dẫn các bạn sử dụng method trong Ajax.

jQuery.get() trong jQuery

  • Tác giả: vietjack.com
  • Đánh giá: 4 ⭐ ( 4479 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: jQuery.get() trong jQuery – Học jQuery cơ bản và nâng cao theo các bước đơn giản về jQuery Selector, Bộ chọn, thuộc tính, Attribute, CSS, Thao tác DOM, Truy cập DOM, AJAX trong jQuery, hiệu ứng, sự kiện trong jQuery, Drag và Drop, Effect, Event Handler, UI, Plug-ins và các tiện ích khác trong jQuery.

JQuery Ajax và kiến thức cơ bản

  • Tác giả: viblo.asia
  • Đánh giá: 4 ⭐ ( 2871 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Giới Thiệu AJAX – “Asynchronous JavaScript and XML” – là một bộ công cụ cho phép load dữ liệu từ server mà không yêu cầu tải lại trang. Nó sử dụng chức năng sẵn có XMLHttpRequest(XHR) của trình duyệt…

Phương thức GET trong jQuery Ajax

  • Tác giả: freetuts.net
  • Đánh giá: 5 ⭐ ( 5400 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tìm hiểu phương thức get trong ajax, cách sử dụng $.ajax để gửi ajax phương thức get và sử dụng $.get để gửi data dưới phương thức get trong jquery

Phương thức Autocomplete của jQuery

  • Tác giả: topdev.vn
  • Đánh giá: 4 ⭐ ( 9291 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Việc tìm kiếm thông tin cần nhanh, chính xác, đáp ứng mục đích của người dùng. Kĩ thuật làm điều đó là phương thức Autocomplete của jQuery.

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Menu thả xuống đáp ứng với mã nguồn tải xuống miễn phí - mã nguồn menu thả xuống

By ads_php