Các trường biểu mẫu tự động tính toán JavaScript
Kích thước tập tin. 198 KBViews Total. 23287Cập nhật lần cuối. 18/09/2021 09. 24. 00 UTC Ngày Xuất bản. 12/07/2018 02. 53. 31 UTCTrang web chính thức. Tới trang webGiấy phép. MIT Show
Tải xuống bản trình diễn Thêm trong danh mục này Xem các plugin được đề xuất TOP 100 Plugin jQuery 2022 Chrome, IE9+, FireFox, Opera, Safari#Máy tính#Giỏ hàng#tính toán AutoCalc là một plugin jQuery được tạo cho giỏ hàng của cửa hàng trực tuyến của bạn, cho phép tính toán động các giá trị của các trường biểu mẫu của bạn tương tự như Excel Công thức được hỗ trợ
hoạt động được hỗ trợ
Xem thêm
Làm thế nào để sử dụng nó1. Để bắt đầu, hãy chèn plugin jQuery AutoCalc sau thư viện jQuery và chúng tôi đã sẵn sàng 2. Thêm công thức vào các trường biểu mẫu của bạn bằng thuộc tính ... 3. Khởi tạo plugin AutoCalc và hoàn tất $('form').jAutoCalc(); 4. Tùy chọn mặc định của plugin $('form').jAutoCalc({ // default attribute attribute: 'jAutoCalc', // thousand separator thousandOpts: [',', '.', ' '], // decimal separator decimalOpts: ['.', ','], // decimal places decimalPlaces: -1, // do the math right away? initFire: true, // allows chained calculation? chainFire: true, // do the math everytime keys are pressed keyEventsFire: false, // are the results read-only? readOnlyResults: true, // shows parse error showParseError: true, // treats empty as zero emptyAsZero: false, // smart intergers? smartIntegers: false, // callback onShowResult: null, // custom functions funcs: {}, // custom constants vars: {} }); Nhật ký thay đổiv1. 4. 2 (2021-09-18)
v1. 4. 0/1 (2021-04-01)
v1. 3. 1 (2021-02-11)
v1. 2. 2 (2021-02-11)
v1. 2. 1 (2020-08-18)
v1. 2. 1 (2020-08-18)
Plugin jQuery tuyệt vời này được phát triển bởi c17r. Để biết thêm Cách sử dụng nâng cao, vui lòng kiểm tra trang demo hoặc truy cập trang web chính thức Thường được yêu cầu tạo một biểu mẫu trực tuyến có thể tính toán tổng số. Đây là một biểu mẫu tính toán HTML đơn giản. Nó có cấu trúc giống như biểu mẫu hóa đơn để bạn có thể sao chép và điều chỉnh. Lưu ý rằng "đơn giản" có nghĩa là dễ hiểu. Vì vậy, tôi đã tránh mọi cám dỗ để tạo mã nhỏ nhất. Ngoài ra, mã sử dụng một số jQuery để thực hiện phép tính Dưới đây là một biểu mẫu tính toán. Thử nhập trường số lượng. Nó sẽ tự động cập nhật tổng số. Lưu ý rằng giá vật phẩm được tính toán và không thể thay đổi Xem biểu mẫu tính toán Pen Simple HTML trên CodePen Mã HTML (hàng)
Mã HTML ở trên tạo một hàng trong biểu mẫu hóa đơn. Lưu ý thuộc tính id của trường số lượng và đơn giá Các hàng còn lại được thêm tương tự Chỉ ID của các trường được thay đổi Bây giờ chúng ta hãy xem số học đằng sau tính toán này. Người dùng chỉ có thể nhập số lượng của các mặt hàng. Chúng tôi tính giá của từng mặt hàng bằng cách nhân số lượng × đơn_giá Tất cả những gì chúng ta cần làm là viết mã JavaScript để tính tổng. Lưu ý rằng mã này sử dụng thư viện Javascript có tên là jQuery. jQuery làm cho mã này dễ hiểu hơn một chút
Mã này ...0 nhận giá trị của trường có ID qty_sugar Mã ...1 có nghĩa là nhân giá trị của qty_sugar với giá đường (đã khởi tạo ở trên). Ký hiệu * dùng để nhân trong Javascript Dòng mã này. ...2 đặt kết quả của phép nhân cho trường ...3 Số lượng * giá trị tính tương tự cho các trường còn lại Sau đó, chúng tôi chỉ cần thêm tất cả các kết quả nhân để tìm tổng
Cuối cùng, chúng tôi đặt giá trị của “tổng số” bằng cách sử dụng mã này
Tuy nhiên, làm thế nào để tính toán chạy mỗi khi bạn chỉnh sửa số lượng? Xử lý sự kiệnĐoạn mã dưới đây nối vào các sự kiện thay đổi và bàn phím cho tất cả các trường có thuộc tính lớp ...4 Sau đó, nó chạy hàm tính toán. Vì vậy, đối với mỗi lần cập nhật, biểu mẫu sẽ tính toán tổng số và hiển thị cho bạn ________số 8 tùy chỉnhĐể thêm các mục của bạn, hãy tìm kiếm một trong các mục ở dạng hiện tại (ví dụ: “đường” ) rồi thử thay đổi mục đó. Khi bạn đã thực hiện các thay đổi, bạn sẽ biết được những thay đổi đó ảnh hưởng như thế nào đến hoạt động của biểu mẫu Làm cách nào để tính giá trị trong JavaScript?Kết quả. html
. const number1 = parseFloat(prompt ('Nhập số đầu tiên. ')); . '));
Làm cách nào để tính tổng đầu vào trong JavaScript?parseInt() được sử dụng để chuyển đổi chuỗi đầu vào của người dùng thành số . const num1 = parseInt(prompt('Nhập số đầu tiên ')); .
Làm cách nào để viết chương trình máy tính bằng JavaScript?Hướng dẫn tạo một máy tính đơn giản . Mã HTML ban đầu để bao gồm. js và. tập tin css. . Input the Digits And Operators. This step creates buttons for digits from 0 to 9 and operators like +,-,*,/, and = .. . Thêm kiểu dáng trong. tập tin css. Để làm đẹp những gì bạn nhìn thấy trên màn hình, kiểu dáng là rất quan trọng Làm cách nào để tự động tính tổng các giá trị đầu vào bằng jQuery hoặc JavaScript?Các bước bắt buộc để lấy tổng giá trị đầu vào bằng cách sử dụng Jquery . Khai báo tất cả các trường đầu vào với thuộc tính id của từng trường đầu vào để tìm các giá trị mong muốn trong mỗi hàng Đồng thời khai báo các trường đầu vào với các thuộc tính lớp của từng trường đầu vào để thu thập tổng của tất cả các trường mong muốn |