Hướng dẫn how to pass thymeleaf variable to javascript function - cách chuyển biến thymeleaf sang hàm javascript

3

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 có một tệp HTML, Thymeleaf, có một biến được truyền từ bộ điều khiển mà tôi cần cung cấp cho một chức năng trên một tệp JavaScript bên ngoài. Làm thế nào để tôi làm điều này ?

Tôi có thể nhận được biến như

<label th:utext="${id}" ></label>

Tôi cần chuyển ID đó cho một hàm bên trong

<script th:src="@{/js/myfunctions.js}" type="text/javascript"></script>

Có một chức năng ở đó:

function myFunction(id){

}

Hỏi ngày 5 tháng 10 năm 2017 lúc 13:34Oct 5, 2017 at 13:34

2

Bạn có thể làm điều gì đó như thế này:

<input type="hidden" id="yourId" th:value="${id}"/>

Sau đó, trong chức năng JS của bạn:

function myFunction(){
 var val = $("#yourId").val();
}

Lưu ý rằng tôi sử dụng jQuery nhưng Principe là như nhau.

Nếu mã chức năng JS nằm trong trang HTML của bạn (không phải .JS Tệp bên ngoài), bạn có thể truy cập giá trị mô hình như thế này:

function myFunction(){
  var val = "${id}";
}

Đã trả lời ngày 5 tháng 10 năm 2017 lúc 13:56Oct 5, 2017 at 13:56

akuma8akuma8akuma8

3,8312 Huy hiệu vàng39 Huy hiệu bạc74 Huy hiệu đồng2 gold badges39 silver badges74 bronze badges

2

Vượt qua một biến như vậy:

<script th:inline="javascript"}">myFunction(/*[[${id}]]*/);</script>

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

Inline HTML Ví dụ:

<script th:src="@{/js/myfunctions.js}" type="text/javascript"></script>

Đã trả lời ngày 7 tháng 5 năm 2020 lúc 22:47May 7, 2020 at 22:47

2

Hãy thử điều này: (hơi muộn với bữa tiệc)

<script type="text/javascript" th:inline="javascript">

th:attr="onChange=|yourFunction(${id})|" </script>

Đã trả lời ngày 11 tháng 8 năm 2021 lúc 20:08Aug 11, 2021 at 20:08

Đây là một ví dụ:

//for parameter
function myfunction ([[${id}]]){
    //this is for address rout 
    window.location=[[@{/user}]]
}

Sử dụng

<script th:src="@{/js/myfunctions.js}" type="text/javascript"></script>

Đã trả lời ngày 9 tháng 11 năm 2021 lúc 15:52Nov 9, 2021 at 15:52

Biến vượt qua Thymeleaf đến JavaScript với các ví dụ mã

Chúng tôi sẽ sử dụng lập trình trong bài học này để cố gắng giải biến vượt qua thymeleaf cho câu đố JavaScript. Điều này được thể hiện bằng mã sau.

<script th:inline="javascript">
    var username = [[${session.user.name}]];
</script>

Bằng cách kiểm tra một loạt các mẫu khác nhau, chúng tôi đã có thể giải quyết vấn đề với biến số Pass Thymeleaf theo chỉ thị JavaScript được đưa vào.

Làm cách nào để sử dụng thymeleaf trong javascript?

Chúng tôi tải bảng kiểu bằng thẻ liên kết với thuộc tính: href đặc biệt của Thymeleaf. Nếu chúng tôi đã sử dụng cấu trúc thư mục dự kiến, chúng tôi chỉ cần chỉ định đường dẫn bên dưới SRC/Main/Resources/Static. Trong trường hợp này, đó là/Styles/CSSandJS/Main. CSS.29-DEC-SALL-SALL

Chúng ta có thể sử dụng thymeleaf trong javascript không?

Thymeleaf là một công cụ mẫu Java phía máy chủ hiện đại cho cả môi trường Web và độc lập, có khả năng xử lý HTML, XML, JavaScript, CSS và thậm chí cả văn bản đơn giản. Mục tiêu chính của Thymeleaf là cung cấp một cách tạo ra các mẫu thanh lịch và được duy trì cao.

Làm thế nào để tôi sử dụng onclick trong thymeleaf?

Sử dụng biến Thymeleaf trong thuộc tính Onclick

• th: onclick = tải lên ($ {gallery)
• th: attr = xông onclick = tải lên ($ {gallery)

Làm thế nào để bạn viết một kịch bản cho thymeleaf?

Thymeleaf đánh giá biểu thức và gán giá trị cho một biến. Để tạo điều kiện cho nó, chúng ta cần sử dụng Th Cú pháp của Thymeleaf để đánh giá biểu thức được viết bằng nhận xét JavaScript, do đó trong khi chạy ngoại tuyến, biểu thức thymeleaf sẽ không được hiển thị.30-OCT-2015

Làm thế nào để bạn sử dụng giá trị trong thymeleaf?

Bạn cũng có thể thay đổi giá trị trong bộ điều khiển, chỉ cần tạo một đối tượng Java từ $ client.name và call setClientName. lớp công khai formControllModel {chuỗi riêng của máy khách = mặc định mặc định; Chuỗi công khai getClientName () {return clientName; } void void setClientName (giá trị chuỗi) {clientName = value; }} 30-JUL-2014

Làm cách nào để in một giá trị trong thymeleaf?

Bạn có thể sử dụng các loại TH: Text =#{biến} để in một biến trong thymeleaf.16-mar-2020

Làm thế nào để bạn sử dụng các mảnh thymeleaf?

Có ba cách cơ bản để bao gồm nội dung từ một đoạn: chèn - chèn nội dung bên trong thẻ. Thay thế - Thay thế thẻ hiện tại bằng thẻ xác định đoạn. Bao gồm-điều này không được chấp nhận nhưng nó vẫn có thể xuất hiện trong mã di sản.28-Dec-2020

Làm thế nào vượt qua giá trị từ JavaScript đến bộ điều khiển trong MVC Spring?

Thêm biến trong lớp miền biểu mẫu của bạn với chú thích @Transient để Spring không tìm phần tử phù hợp với bảng cơ sở dữ liệu của bạn. ví dụ. Và sau đó đặt $ ((##CountrySelection). giá trị (sự phân giải nông thôn); Sử dụng jQuery.19-Jun-2013 của bạn

Làm thế nào để bạn thêm thymeleaf vào html?

Tệp HTML phải được đặt trong thư mục mẫu và tất cả các tệp JS và CSS nên được đặt trong thư mục tĩnh trong ClassPath. Trong ví dụ được hiển thị, chúng tôi đã sử dụng tệp CSS để thay đổi màu của văn bản. Bây giờ, chúng ta cần thêm sự phụ thuộc của Thymeleaf khởi động Spring Boot trong tệp cấu hình bản dựng của chúng tôi.

Trong dữ liệu văn bản từ các biến nên được xuất tốt hơn vào dữ liệu -* các thuộc tính và sau đó đọc từ trình xử lý sự kiện?

Một trường hợp điển hình là các thuộc tính HTML cho Trình xử lý sự kiện (ví dụ: on onload,), trong đó dữ liệu văn bản từ các biến nên được xuất tốt hơn cho các thuộc tính dữ liệu của Google-*và sau đó đọc từ trình xử lý sự kiện.16-APR-2019

Tôi có thể sử dụng thymeleaf trong javascript không?

Làm thế nào để bạn vượt qua các tham số trong thymeleaf?

Làm thế nào để bạn thêm JavaScript vào Thymeleaf?

Làm thế nào để bạn viết chức năng onclick trong thymeleaf?