Gần đây, một số bạn đọc đã phản ánh rằng khi gửi biểu mẫu bình luận trên blog của tôi,77win1 họ phải chờ đợi khá lâu. Điều này dẫn đến tình trạng người dùng nhấp nhiều lần vào nút gửi, gây ra hiện tượng bình luận bị lặp lại không mong muốn. Để giải quyết vấn đề này, tôi đã tìm hiểu và thử nghiệm rất nhiều phương án khác nhau như thay đổi hosting, thay đổi giao diện, tối ưu hóa cơ sở dữ liệu,… nhưng vẫn chưa khắc phục được hoàn toàn.

Tuy nhiên, tôi không thể ngồi sky88 fun yên nên đã nghĩ đến cách sử dụng bình luận AJAX. Ý tưởng là khi người dùng gửi bình luận, nút gửi sẽ bị ẩn đi và hiển thị thông báo yêu cầu họ chờ trong giây lát, từ đó tránh được việc nhấn đi nhấn lại. May mắn thay, sau khi tìm kiếm trên mạng, tôi đã phát hiện ra plugin AjaxComments và ngay lập tức tiến hành cài đặt.

Nhưng rồi vấn đề lại nảy sinh - khi đăng nhập, việc gửi bình luận bằng AJAX hoạt động hoàn toàn bình thường, nhưng với người dùng không đăng ký (tức là khách), khi gửi bình luận thì lại xảy ra lỗi. Tiếc rằng tôi không rõ nguyên nhân cụ thể của lỗi này cũng như cách để sửa chữa. Có lẽ do sự khác biệt giữa các phiên bản, vì plugin này chỉ tương thích với typecho 0.8, còn phiên bản 1.0 có vẻ đã có một số thay đổi khiến nó không còn hiệu quả nữa.

Không bỏ cuộc, tôi tiếp tục tìm kiếm và thử nghiệm thêm nhiều đoạn mã tương tự. Cuối cùng,77win1 tôi đã tìm ra giải pháp - một đoạn mã JavaScript đơn giản kết hợp với HTML giúp hiển thị thông báo đang xử lý sau khi gửi bình luận đồng thời khóa nút gửi để ngăn chặn việc gửi đi gửi lại.

Các đoạn mã trên cần được đặt trước nút gửi. Bạn có thể tùy chỉnh kích thước, màu sắc, nội dung thông báo hoặc thêm các hiệu ứng hình ảnh, CSS3 theo ý muốn.

Cuối cùng,77win1 hãy thêm thuộc tính onClick=“showSending()” vào thẻ type=“submit” để kích hoạt chức năng này.

Với giải pháp này, trải nghiệm người dùng đã được cải thiện đáng kể, giảm thiểu tối đa tình trạng bình luận bị trùng lặp do nhấp chuột nhiều lần.