2009-02-02 20 views
6

Trong Javascript, tôi có một chuỗi nhất định và tôi muốn bằng cách nào đó đo lường bao nhiêu không gian (tính bằng pixel) mà nó sẽ lấy trong một phần tử nhất định. Về cơ bản những gì tôi có là một yếu tố sẽ trôi nổi trên mọi thứ khác (như một chú giải công cụ), và tôi cần phải thiết lập chiều rộng của nó bằng tay thông qua Javascript, do đó, nó sẽ điều chỉnh cho văn bản bên trong.
Tôi không thể tự động phát triển "tự động phát triển" như phần tử nội tuyến sẽ tăng theo chiều ngang để chứa con của nó.Làm thế nào bạn có thể đo không gian mà một văn bản sẽ có trong Javascript?

Trong Windows, có các API thực hiện việc này. Có cách nào để làm điều tương tự trong Javascript?
Nếu không có cách nào phù hợp, cách tiếp cận nào bạn tin là khả thi? (Giống như, thử các chiều rộng khác nhau và kiểm tra chiều cao để đảm bảo chiều cao không vượt quá ngưỡng nhất định).

Ít "giá trị pixel" tôi có thể mã hóa trong JS của mình tốt hơn, rõ ràng.

+0

Dường hackish, nhưng tôi đã thêm yếu tố để các dom, đâu đó vô hình như '#temp {position: absolute; đầu trang: -1000} 'để tôi có thể đo lường và hành động tương ứng. Mong các câu trả lời. – meouw

Trả lời

1

này rất dễ dàng sử dụng một khuôn khổ JavaScript. Tôi đang sử dụng Prototype trong ví dụ này.

<span id='text' style='border:1px solid #000000;font-size:14px'>hello this is sample text</span> 

<script type="text/javascript"> 
alert($('text').getWidth()) 
</script> 
3

Với HTML này <span>text here</span> bạn phải đọc thuộc tính offsetWidth của nhịp, được chỉ định khi các yếu tố tự được thêm vào DOM mà không một phong cách mà làm cho nó vô hình. Về mặt kỹ thuật, điều này có nghĩa là trình duyệt phải có khả năng tải trực quan phần tử trong DOM để có thể xây dựng và gán thuộc tính offsetWidth.

Something như thế này sẽ làm việc:

var span = document.createElement("span"); 
span.appendChild(document.createTextNode("text here")); 

span.style = ""; // to make sure the elment doesn't have "display: none" or such 
document.body.appendChild(span); // adding it to the DOM 

var textWidth = span.offsetWidth; 

// be sure to hide or remove the span if you don't need it anymore 
+0

Nếu bạn cần ẩn, bạn có thể ẩn, đo, sau đó ẩn lại. Tôi chưa bao giờ gặp sự cố với "nhấp nháy" – Stephen

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