2010-02-24 33 views
20

Tôi rất mới với các công nghệ web và điều này về cơ bản là cho một dự án hạn mà nhóm của tôi đang làm việc. Chúng tôi đang làm việc trên một trang web đánh giá thực phẩm.Làm thế nào để xây dựng một hệ thống đánh giá 5 sao cơ bản và đơn giản?

Hiện tại, tôi không hoàn toàn chắc chắn cách triển khai hệ thống xếp hạng 5 sao đơn giản. Tôi có nên sử dụng một ngôn ngữ phía máy chủ như PHP hoặc một phía máy khách như Javascript (w/JQuery). Nhìn xung quanh nó có vẻ như là JQuery là phù hợp hơn cho điều này? Hay nó sẽ là sự kết hợp của cả hai?

Những gì tôi đang tìm kiếm như xa như chức năng đi là:

  • Sao sáng lên khi di chuột
  • Trang không phải được nạp lại khi một ngôi sao đang nhấp (không thực sự cần thiết)
  • một số loại trung bình hiển thị bên cạnh sao
  • Rating phải được lưu trữ ở đâu đó trong một cơ sở dữ liệu MySQL (đây có phải là một ý tưởng tốt?)
0.123.

Tôi thực sự xin lỗi nếu câu hỏi có vẻ mơ hồ và ngu ngốc, tôi không có nhiều manh mối về cách thực hiện điều này và tôi đã thử googling xung quanh. Nếu bạn có bất kỳ câu hỏi nào về nó, hãy cho tôi biết.

Cảm ơn bạn rất nhiều.

Trả lời

20

Sao sáng lên khi di chuột
Có một hướng dẫn rực rỡ trên web cho thiết kế một hệ thống xếp hạng 5 sao: http://rog.ie/blog/css-star-rater. Nó hoàn toàn là CSS nên không cần Javascript.

Trang không phải được nạp lại khi một ngôi sao đang nhấp (không thực sự cần thiết)
Ajax là bạn của bạn, những gì tôi đã làm là để có một <a class="one_star" href="javascript: submitRating(1, 5)"> nơi <a> đại diện một ngôi sao và submitRating() chức năng sử dụng Ajax để truyền xếp hạng của tôi (1/5) đến máy chủ, máy chủ lưu trữ xếp hạng (và chỉ định người dùng đã xếp hạng) và tính lại xếp hạng trung bình mới và gửi kết quả trở lại ở định dạng JSON.

Một số loại trung bình được hiển thị bên cạnh các ngôi sao
Dễ dàng. Viết một kịch bản lệnh SQL, dựa trên id sản phẩm, lấy số tổng số của xếp hạng trung bình (tức là 1/5 + 2/5 + 4/5, v.v.), chia cho (tổng) tổng số xếp hạng và nhân nó với 100. Trả về giá trị trở lại máy chủ và từ máy chủ trở lại máy khách.

Rating phải được lưu trữ ở đâu đó trong một cơ sở dữ liệu MySQL (Đây có phải là một ý tưởng tốt?)
Tôi đang sử dụng MySQL cho điều này và nó hoạt động như một nét duyên dáng .... Bất kỳ hệ thống DB là tốt.

+1

Giới thiệu ngắn gọn về Ajax (http://en.wikipedia.org/wiki/Ajax_%28programming%29) và JSON (http://en.wikipedia.org/wiki/JSON) –

+0

AJAX, hoặc thậm chí là Javascript, không phải là cần thiết để không tải lại trang: http://stackoverflow.com/questions/17385583/how-does-netflix-submit-ratings-without-a-page-refresh –

+1

Liên kết được tạo kiểu ... –

3

Sao sáng lên khi di chuột
Đơn giản, có hình ảnh sao vàng và hình ảnh cho sao trắng. Khi một ngôi sao bị lơ lửng, tất cả các ngôi sao ở bên trái có "src" của chúng được đổi thành ngôi sao màu vàng, tất cả các ngôi sao ở bên phải có srcs của chúng thay đổi thành ngôi sao màu trắng.

Trang không được nạp lại khi ngôi sao đang nhấp
Nhìn vào Ajax/XHR
http://en.wikipedia.org/wiki/Ajax_(programming)
Gợi ý: Có một tập tin .php gọi vote.php, và vượt qua nó vào ID của thức ăn và xếp hạng do người dùng đưa ra.

Một số loại trung bình cho thấy giữa các vì sao
Hầu hết các trang web chỉ hiển thị 0%, 50% và 100% sao ... người dùng sẽ không thực sự lăn tăn nếu họ không nhận được 'chính xác chính xác'

Đánh giá nên được lưu trữ trong cơ sở dữ liệu MySQL
Bất kỳ hệ thống cơ sở dữ liệu là tốt. Nhưng có, bạn có thể muốn sử dụng cơ sở dữ liệu SQL cho

+0

Đối với câu trả lời đầu tiên của bạn, bạn có thể thực hiện bằng cách sử dụng CSS ... Xem câu trả lời của tôi. –

0

Vâng, bạn đang tiếp cận âm thanh hoàn hảo.có một vài mảnh:

sao với hiệu ứng di chuột:

jquery: http://www.fyneworks.com/jquery/star-rating/

nguyên mẫu: http://www.fyneworks.com/jquery/star-rating/

css: http://www.henryhoffman.com/css-star-rating-tutorial.html

onclick có thể gọi một cuộc gọi ajax với jquery: http://api.jquery.com/jQuery.post/

sau đó ở phía máy chủ nó có thể được duy trì trong một bảng giá

theres một ví dụ nữa ở đây:

http://webtint.net/tutorials/5-star-rating-system-in-php-mysql-and-jquery/

0

Sự kết hợp giữa JS và PHP là con đường để đi (nếu PHP là lựa chọn của bạn ngôn ngữ phía máy chủ). JQuery là một cách hay để dễ dàng thực hiện một loại hệ thống gắn dấu sao, tôi đã từng phát triển nó cho một trong các trang web của tôi sau này đã bị xóa. Đó là một điều đơn giản có sự kiện onrollover liên quan đến 5 hình ảnh. Khi được nhấp vào, nếu nó là "id 4", nó sẽ gửi điều đó như bình chọn của người dùng bằng cách sử dụng hàm .post() của jQuery tới một tập lệnh PHP ghi chú người dùng và ghi lại phiếu bầu trong cơ sở dữ liệu MySQL nếu họ không Đã bỏ phiếu.

0

Để có điều khiển sao nhấp chuột đẹp, bạn cần javascript. Vì vậy, bạn nên làm jQuery.

Có, bạn sẽ muốn lưu trữ nội dung trong cơ sở dữ liệu. Bạn có thể sử dụng PHP và MySQL cho điều đó.

Vì đây là bài tập ở lớp, rất nhiều điều để triển khai. Xem xét gian lận bằng cách sử dụng CMS hiện có. Drupal nói riêng có chức năng tương tự như những gì bạn yêu cầu. Bạn sẽ không phải học nhiều về Drupal, chỉ cần mua cuốn sách "Sử dụng Drupal". Chương 4 sẽ hướng dẫn bạn cách:

... xây dựng trang web đánh giá sản phẩm cộng đồng, ... và mô-đun Fivestar cung cấp tiện ích xếp hạng.

Drupal dựa trên PHP và sử dụng MySQL làm cơ sở dữ liệu, vì vậy nó có vẻ khớp với nơi bạn đang đi. Nó có thể mất một chút để có được Drupal chạy ... nhưng sau đó bạn có thể đến chương 4 trong tích tắc.

Nếu giáo viên khẳng định bạn viết mã, Drupal là nguồn mở và dễ dàng thêm mô-đun tùy chỉnh.

+1

Bạn không cần phải làm điều đó chỉ với jQuery ... Tôi đã sử dụng ajax đơn giản và JS ... không có biggie! –

Các vấn đề liên quan