Hướng dẫn split break line javascript - ngắt dòng javascript

Tôi có một chức năng nhỏ tôi thấy lấy một chuỗi từ

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

4 và sau đó đặt nó vào một phần tử

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

5 và kết thúc văn bản khi dòng quá dài. Nhưng nó không phát hiện phá vỡ dòng. Đây là những gì nó đang làm và những gì nó nên làm:

Input:

Hello

This is dummy text that could be inside the text area.
It will then get put into the canvas.

Đầu ra sai:

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

Nó nên đầu ra những gì:

Hello

This is dummy text that
could be inside the text
area. It will then get
put into the canvas.

Đây là chức năng tôi đang sử dụng:

function wrapText(context, text, x, y, maxWidth, lineHeight) {
    var words = text.split(' ');
    var line = '';

    for(var n = 0; n < words.length; n++) {
        var testLine = line + words[n] + ' ';
        var metrics = context.measureText(testLine);
        var testWidth = metrics.width;
        if (testWidth > maxWidth && n > 0) {
            context.fillText(line, x, y);
            line = words[n] + ' ';
            y += lineHeight;
        }
        else {
            line = testLine;
        }
    }
    context.fillText(line, x, y);
}

Có thể đạt được những gì tôi đang cố gắng để có được không? Hoặc có cách nào đơn giản là di chuyển khu vực văn bản như vào khung vẽ?

user2357112

244K26 Huy hiệu vàng399 Huy hiệu bạc477 Huy hiệu đồng26 gold badges399 silver badges477 bronze badges

hỏi ngày 11 tháng 2 năm 2014 lúc 19:59Feb 11, 2014 at 19:59

Silk lụa DustinDustin Silk

4.0105 Huy hiệu vàng30 Huy hiệu bạc44 Huy hiệu đồng5 gold badges30 silver badges44 bronze badges

7

Sử dụng

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

6:

var str = `your text
           that spans
           multiple lines`

// Split the string on \n or \r characters
var separateLines = str.split(/\r?\n|\r|\n/g);

alert("Total number of separate lines is: " + separateLines.length);

Hoặc sử dụng

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

7 thay thế:

var str = `your text
           that spans
           multiple lines`

// Split the string on \n or \r characters
var separateLines = str.match(/[^\r\n]+/g);
 
alert("Total number of separate lines is: " + separateLines.length);

Hy vọng điều đó sẽ giúp!

Đã trả lời ngày 11 tháng 2 năm 2014 lúc 20:13Feb 11, 2014 at 20:13

6

Chia chuỗi chia trong JavaScript

var array = str.match(/[^\r\n]+/g);

HOẶC

var array = str.split(/\r?\n/);

Đã trả lời ngày 3 tháng 2 năm 2019 lúc 10:42Feb 3, 2019 at 10:42

Tính Ngô Quangtính Ngô QuangTính Ngô Quang

4.1461 Huy hiệu vàng31 Huy hiệu bạc32 Huy hiệu đồng1 gold badge31 silver badges32 bronze badges

2

Trong trường hợp bạn cần chia một chuỗi từ JSON của mình, chuỗi có ký tự đặc biệt \ n được thay thế bằng \ n.

Chia chuỗi chia theo dòng mới:

Result.split('\n');

Chuỗi phân chia nhận được trong JSON, trong đó ký tự đặc biệt \ n được thay thế bằng \ n trong JSON.Stringify (trong JavaScript) hoặc json.json_encode (tính bằng PHP). Vì vậy, nếu bạn có chuỗi của mình trong phản hồi AJAX, nó đã được xử lý để vận chuyển. và nếu nó không được giải mã, nó sẽ thay thế \ n được thay thế bằng \\ n ** và bạn cần sử dụng:\n was replaced with \\n during JSON.stringify(in javascript) or json.json_encode(in PHP). So, if you have your string in a AJAX response, it was processed for transportation. and if it is not decoded, it will sill have the \n replaced with \\n** and you need to use:

Result.split('\\n');

Lưu ý rằng các công cụ trình gỡ lỗi từ trình duyệt của bạn có thể không hiển thị khía cạnh này như bạn mong đợi, nhưng bạn có thể thấy rằng việc chia tách bởi \ n dẫn đến 2 mục như tôi cần trong trường hợp của tôi:

Đã trả lời ngày 22 tháng 5 năm 2017 lúc 6:00May 22, 2017 at 6:00

Profimedicaprofimedicaprofimedica

2.45831 Huy hiệu bạc39 Huy hiệu đồng31 silver badges39 bronze badges

Đây là những gì tôi đã sử dụng để in văn bản lên một tấm bạt. Đầu vào không đến từ

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

4, nhưng từ

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

9 và tôi chỉ chia tách theo không gian. Chắc chắn không hoàn hảo, nhưng làm việc cho trường hợp của tôi. Nó trả về các dòng trong một mảng:

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

0

Đã trả lời ngày 16 tháng 7 năm 2015 lúc 15:20Jul 16, 2015 at 15:20

Martinmartinmartin

461 Huy hiệu bạc5 Huy hiệu đồng1 silver badge5 bronze badges

Bạn có thể sử dụng chức năng

Hello

This is dummy text that
could be inside the text
area. It will then get
put into the canvas.

0 để phá vỡ đầu vào trên cơ sở ngắt dòng.

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

1

Ann Zen

25,9K7 Huy hiệu vàng32 Huy hiệu bạc53 Huy hiệu Đồng7 gold badges32 silver badges53 bronze badges

Đã trả lời ngày 27 tháng 7 năm 2020 lúc 19:18Jul 27, 2020 at 19:18

Bạn nên thử phát hiện dòng đầu tiên.

Sau đó::

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

2

Tôi không chắc chắn, nhưng có lẽ nó sẽ giúp.

Đã trả lời ngày 11 tháng 2 năm 2014 lúc 20:16Feb 11, 2014 at 20:16

NetzachnetzachNetzach

3212 Huy hiệu bạc13 Huy hiệu đồng2 silver badges13 bronze badges

Đây là mã cuối cùng tôi [op] đã sử dụng. Có lẽ không phải là thực hành tốt nhất, nhưng nó đã làm việc.

Hello this is dummy text
that could be inside the
text area. It will then
get put into the canvas.

3