2012-03-14 29 views
5

Về cơ bản tôi cần phải tạo một vùng văn bản có giới hạn ký tự, nhưng sẽ có một từ ngay từ đầu, rằng chúng không thể thay đổi.Làm thế nào để khóa từ đầu tiên của một vùng văn bản?

Nó cần phải là một phần của vùng văn bản, nhưng tôi không muốn người dùng có thể xóa nó hoặc chỉnh sửa nó.

Tôi đã nghĩ mình có thể tạo hàm JQuery bằng cách sử dụng blur() để ngăn không cho người dùng quay trở lại, nhưng tôi cũng cần ngăn họ chọn từ đó và xóa từ đó.

CẬP NHẬT Tôi đã viết JQuery này có vẻ hoạt động tuyệt vời! Tuy nhiên tôi thích giải pháp dưới đây vì nó không yêu cầu Javascript.

<script type="text/javascript"> 
    var $el = $("textarea#message_create_body"); 
    $el.data('oldVal', $el.val()); 

    $el.bind('keydown keyup keypress', function() { 
     var header = "Header: "; 
     var $this = $(this); 
     $this.data('newVal', $this.val()); 
     var newValue = $this.data("newVal"); 
     var oldValue = $this.data("oldVal"); 

     // Check to make sure header not removed 
     if (!(newValue.substr(0, header.length) === header)) { 
      $(this).val(oldValue); 
     } else { 
      $(this).data('oldVal', $(this).val()); 
     } 
    }); 
</script> 

Trả lời

8

Nếu bạn chỉ muốn văn bản hiển thị tiền tố, bạn có thể sử dụng nhãn, thay đổi vị trí và thụt lề nội dung văn bản. Người dùng sẽ không nhận thấy sự khác biệt.

Bạn có thể xem cách hoạt động tại đây: http://jsfiddle.net/FLEA3/.

+0

Điều này có vẻ tuyệt vời! Tôi sẽ sử dụng phương pháp của bạn. –

3

Chỉ cần đặt từ này làm nhãn bên cạnh hộp văn bản? Nó có thể gây nhầm lẫn cho người dùng không thể chỉnh sửa một phần văn bản trong hộp văn bản.

+0

Tôi đã suy nghĩ về việc đặt một số phần tử văn bản lên vùng văn bản, và sau đó tiến lên con trỏ để đạt được cùng một hiệu ứng. Có cách nào để nâng cấp con trỏ chỉ cho dòng đầu tiên không? –

1

Nó sẽ không thể tốt hơn nếu bạn chỉ cảnh báo cho người dùng biết bất cứ điều gì anh đầu vào trong textarea sẽ được đệ trình với một "tiền tố" và sau đó

  • hiển thị tiền tố như một nhãn trước khi textarea
  • thêm tiền tố vào văn bản được nhập trước khi gửi
Các vấn đề liên quan