Cần thanh trượt có thể tăng theo cấp số nhân (không sử dụng dải ô)

Question

Hiện tại tôi đang sử dụng thanh trượt của giao diện người dùng jQuery để cho phép mọi người chọn số tiền đóng góp. Vấn đề là, thanh trượt là nhỏ và cần phải bù cho tối thiểu là $ 1 và tối đa là $ 10,000. Giải pháp được đề xuất là sử dụng số gia tăng nhỏ, có thể là 1 đô la hoặc 2 đô la, cho các giá trị từ 1 đô la đến 1000 đô la, và từ đó tăng số gia tăng lên tới 10.000 đô la, nhưng tôi không thể tìm thấy plugin có khả năng này.

Vì vậy, ngay bây giờ tôi có số gia tăng là $ 1 và như bạn có thể đoán, gần như có thể chọn một số tiền cụ thể.

Mọi trợ giúp sẽ tuyệt vời!

Answer 1

Thanh trượt hầu như không đánh tôi là công cụ thích hợp cho công việc đó.

Nhưng nếu bạn nhấn mạnh, bạn có thể tăng kích thước bước thanh trượt (ví dụ: 10 vị trí có thể) và cho mỗi bước tra cứu số tiền tương ứng.

Ví dụ:

• 1 -> 1 $
• 2 -> 2 $
• 3 -> 5 $
• 4 -> 10 $
• 5 -> 50 $
• 6 -> 200 $
• 7 -> 1k $
• 8 -> 5k $
• 9 -> 10k $
• 10 -> 20k $

Answer 2

Để thêm vào @brunodecarvalho 's câu trả lời, làm cho một JSlider với dấu ngoặc đánh dấu nhưng không có nhãn, cặp vợ chồng nó với một JLabel hoặc một JTextField để khi giá trị của thanh trượt được thay đổi, giá trị được ánh xạ thích hợp xuất hiện trong các số JLabel hoặc JTextField.

Nếu bạn đang sử dụng JTextField, hãy tin tưởng giá trị trong số tiền thực tế của người dùng (để anh ấy có thể chỉnh sửa và chọn giá trị không nằm trên thanh trượt) và cập nhật thanh trượt đánh dấu khi các thay đổi JTextField.

Answer 3

Như đã nói trước đây, bạn sẽ phải ánh xạ vị trí thanh trượt với số tiền. Đây là ánh xạ gần như lôgarít đẹp có thuộc tính tốt đẹp cho các giá trị tròn:

var slider_values = []; 
var mantissas = [1, 1.2, 1.4, 1.6, 1.8, 2, 2.5, 3, 3.5, 4, 4.5, 5, 6, 7, 8, 9]; 
for (var base = 1; base < 10000; base *= 10) { 
    for (var i = 0; i < mantissas.length; i++) 
     slider_values.push(mantissas[i] * base); 
} 
slider_values.push(10000); 

Bản đồ này là dãy số nguyên 0,64 đến phạm vi 1 - 10.000.