PDA

View Full Version : Giúp mình thực hiện ý tưởng javascript này



tungoso
21-01-2011, 15:46
Hi.
Mình đang có nhu cầu làm 1 ứng dụng web, trên trang web có 1 đoạn văn bản và 1 textarea, người dùng phải nhập lại chính xác đoạn văn bản vào textarea, và yêu cầu của mình như sau:

- Không thực hiện được việc copy - paste từ đoạn văn bản vào textarea, cái này mục đích là bắt buộc hõ phải gõ vào textarea
- Bắt buộc phải gõ chính xác theo đoạn văn bản, ví dụ nếu gõ sai thì ko thể gõ tiếp được, phải sửa lại cho đúng thì mới gõ tiếp được đoạn sau.

Ý tưởng là vậy, mong các pac giúp đỡ.

Thanks

gycoder
21-01-2011, 22:40
Mình thật sự không thích ý tưởng này vì nó tỏ ra khắt khe đối với người sử dụng. Nhưng về coding, ý tưởng này là có thể thực hiện được.

Xem xét yêu cầu thứ nhất, cấm paste, hãy tự hỏi làm thế nào nhận biết có 1 nội dung vừa được paste xuống textarea :

- có 1 sự kiện nào gọi là onpaste phát sinh khi paste tương tự như onclick phát sinh khi click không? Thử google từ khóa "javascript onpaste event (http://www.google.com/search?q=javascript+onpaste#hl=en&sugexp=ldymls&xhr=t&q=javascript+onpaste+event&cp=20&pf=p&sclient=psy&aq=0&aqi=&aql=&oq=javascript+onpaste+e&pbx=1&fp=9809f9a75fc5a4aa)".

- nếu 1 trình duyệt không hỗ trợ onpaste thì giải quyết thế nào? Có thể dùng 1 setTimeout liên tục theo dõi nội dung trong textarea và so sánh nó mỗi lúc để nắm bắt những thay đổi khác với khi gõ từng chữ thông thường không ?

Bạn có thể tạm hài lòng với onpaste và câu hỏi thứ hai để lại sau xử lý nâng cao cũng được. Cứ giải quyết xong yêu cầu thứ nhất, rồi sang đến phần kiểm tra so sánh nội dung. Gợi ý là dùng onkeyup, onkeypress. Nội dung là đúng nếu chuỗi trong textarea là là 1 phần trong đoạn văn bản có sẵn, tính từ ký tự đầu tiên. Đơn giản thế thôi lol

ngoc_viet08
22-01-2011, 01:23
có thể để 1 div trong suốt đè lên bên trên text ko nhỉ ?
có thể may ra nó ko cho user tương tác với div chứa text.

cái 2 thì khó .

BnoL
22-01-2011, 03:14
Có định đạng bold, italic, canh hàng gì k bạn. hay thuần là plain text? Nếu là plain text thì đơn giản vầy thui...


<div oncopy="alert('you cannot copy this text'); return false;" id="content">You cannot copy this text</div>
<textarea onpaste="alert('you cannot paste here'); return false;" id="text">
</textarea>
<script type="text/javascript">
var content;
document.getElementById('text').onkeyup = function()
{
content = document.getElementById('content').innerHTML;

if(content.indexOf(this.value) != 0)
{
//Xóa kí tự cuối. Nếu bạn muốn chính xác hơn thì get vị trí dấu nháy và xóa kí tự trước nó.
this.value = this.value.substr(0, this.value.length - 1);
alert('Nhap ky tu khong chinh xac!');
return false;
}
return true;
}
</script>

thuyduongcd
22-01-2011, 10:16
Làm vậy để làm gì không biết. Disable js rồi paste vô tư. Thay vì cố "làm khó" người dùng thì hãy tìm cách nào thuận tiện cho người dùng nhất. Đó mới là một phong cách làm web thông minh.

chesterben
22-01-2011, 12:27
Giờ viết web thậm chí người ta còn show cả source-code (Github, Bitbucket) cho mọi người cùng xem chớ nói gì là mấy thứ lặt vặt. Usability là thứ nên được quan tâm hàng đầu nếu muốn sống lâu. Còn mấy cái thủ thuật với cái máy (SEO) thì chỉ giúp sống thoi thóp thôi lol

diepnghitinh
22-01-2011, 13:52
Làm vậy để làm gì không biết. Disable js rồi paste vô tư. Thay vì cố "làm khó" người dùng thì hãy tìm cách nào thuận tiện cho người dùng nhất. Đó mới là một phong cách làm web thông minh.

ông này chả hiểu gì hết ?
đây là 1 trang dùng kỹ thuật tương tự nè và cũng rất nổi tiếng đó

Đua xe đánh chữ 1 trò chơi khá hay đó mà ... chơi thử đi :bored:
http://play.typeracer.com/

VnVision
22-01-2011, 16:37
ông này chả hiểu gì hết ?
đây là 1 trang dùng kỹ thuật tương tự nè và cũng rất nổi tiếng đó

Đua xe đánh chữ 1 trò chơi khá hay đó mà ... chơi thử đi :bored:
http://play.typeracer.com/

Trò này hay phết nhỉ. Tiếc là ko có thời gian chứ ko làm một cái cho ng Việt chơi :(

haicop
22-01-2011, 17:11
Vấn đề người ta cần để làm ứng dụng gì đó liên quan đến đánh máy, không thì chủ thớt đã ko lên nhờ. Mình search trên google đc mấy cái này.

Để chống copy dán
<body onpaste="return false";>
<body oncopy="return false";>

Giải quyết vấn đề đoạn văn : Nên tách bài viết ra nhiều đoạn với ID khác nhau rồi so sánh, nếu để nguyên cả bài viết rồi so sánh textarea với đoạn văn mình nghĩ hơi khó.

leetinhf
22-01-2011, 17:34
Trò này hay phết nhỉ. Tiếc là ko có thời gian chứ ko làm một cái cho ng Việt chơi :(

Có ngôn ngữ tiếng Việt luôn mà, có cả xếp hạng tốc độ đánh chữ nữa :">x_x

http://play.typeracer.com/?universe=lang_vi

fsviet
23-01-2011, 01:20
các bác cài thêm addon NoScript cho FF cho tịt hết trò nài. hehe
Nên dùng flash cho tiện

trinhdiep
23-01-2011, 14:23
oh. co vài cách mà
1. tiện nhất là dùng flash (vì người dùng khó mò code flash)
2. là dùng ảnh(chuyển toàn bộ text sang ảnh rồi show ảnh- cái nè cũng không khó - làm trên server)
3. dùng js. js cũng có nhiều cách.
a) không cho chọn văn bản
b) không cho copy/paste
c) dùng canvas để chuyển kí tự sang dạng ảnh

gycoder
24-01-2011, 13:57
có thể để 1 div trong suốt đè lên bên trên text ko nhỉ ?
có thể may ra nó ko cho user tương tác với div chứa text.



Chắc chắn chứ không phải "có thể may ra". Cách này chính là cách dễ dàng nhất, thậm chí không cần dùng javascriptv :)

Một lưu ý khác, nếu văn bản chứa tiếng Việt có dấu, và web dùng vietUni hoặc Avim để cho phép bỏ dấu thanh, thì nên kiểm tra chuỗi bằng onkeyup thay vì onkeypress, vì onkeyup xảy ra khi ký tự đã được gõ hoàn chỉnh.


các bác cài thêm addon NoScript cho FF cho tịt hết trò nài. hehe
Nên dùng flash cho tiện

Tớ cho rằng người ta dùng NoScript ít hơn FlashBlock đấy lol

addme
24-01-2011, 14:06
Làm vậy để làm gì không biết. Disable js rồi paste vô tư. Thay vì cố "làm khó" người dùng thì hãy tìm cách nào thuận tiện cho người dùng nhất. Đó mới là một phong cách làm web thông minh.

Chính xác, disable js rồi thì có cấm cũng vô dụng :lick: