在ajax响应之后在javascript中定义类

时间:2018-03-28 06:33:51

标签: javascript ajax

当我在ajax响应类“navtex-message”不起作用后使用javascript创建html时。

function formatNtxMessage( m ) {
    return '<div class="row">' +
        '<div class="col-lg-9">' +
            '<div class="navtex-message">' +
                JSON.stringify(m.content).replace(/\"/g, "")  + 
            '</div>' +
        '</div>' +          
    '</div>';
}

function format ( d ) {
    var div = $('<div/>')
     .addClass( 'loading' )
     .text( 'Učitavanje...' );

     $.ajax( {
         type: "GET",
         url: '/api/ntxMessage/' + d.id,
         success: function ( json ) {
             div
                 .html(formatNtxMessage(json.data))
                 .removeClass( 'loading' );
         }
     } );

    return div;
}

类navtex-message在文本换行中改为\ r \ n:\ n \ n

.navtex-message {
    white-space: pre-line;
}

我得到的字符串:

ZCZC QE02\r\n050640 UTC MAR\r\n\r\nSPLIT RADIO\r\n\r\nWEATHER BULLETIN FOR ADRIATIC\r\n\r\nISSUED BY THE MARINE METEOROLOGICAL CENTER SPLIT ON 05/03/2018 AT 0400 UTC\r\n\r\n1. WARNING:\r\n\r\nISOLATED GUST OF SE / NE WIND, IN THE EVENING NW 35-45 KTS, IN VELEBIT STRATE NW TO 55 KTS. POSSIBLE SUDDEN STORMS. \r\n\r\n2. SYNOPSIS:\r\n\r\nTROUGH WITH FRONTAL DISTURBANCE APPROACHED TOWARD ADRIATIC FM THE WEST.\r\n\r\n3. FORECAST FOR THE NEXT 24 HOURS VALID UNTIL 06/03/2018. AT 0400 UTC\r\n\r\nN-ERN ADRIATIC:\r\n\r\nNE, OFFSHORE AT FIRST SE, IN THE EVENING AND OVERNIGHT NW INCREASING ON 12-24, IN VELEBIT STRATE TO 30 KTS. TOMORROW NE / NW WIND DECREASING ON 4-12 KTS. SEA INCREASING ON 3-4, TOMORROW DECREASING ON 2-3. VSBY 10-20 KM. MOSTLY CLOUDY WITH RAIN, POSSIBLE THUNDERSHOWERS.\r\n\r\nCENT ADRIATIC:\r\n\r\nSE INCREASING ON 15-30, OVERNIGH TURNING ON NW 12-24 KTS, TOMORROW DECREASING ON 4-12 KTS. ALONG THE COAST LOCALLY E / NE 6-16 KTS, MOSTLY ON N-ERN PART.SEA 2-3, INCREASING ON 3-4, TOMORROW DECREASING ON 2-3. VSBY 10-20 KM. MOSTLY CLOUDY WITH RAIN, POSSIBLE THUNDERSHOWERS.\r\n\r\nS-ERN ADRIATIC:\r\n\r\nSE WIND INCREASING ON 16-32, OVERNIGHT TURNING ON NW 12-24 KTS, TOMORROE DECREASING AND TURNING ON SW 4-14, ON FAR OF SOUTH TO 18 KTS. ALONG THE COAST LOCALLY E / NE 6-16, ON FAR OF SOUTH TO 20 KTS. SEA 2-3, INCREASING ON 3-4, TOMORROW DECREASING ON 2-3. VSBY 10-20 KM. MOSTLY CLOUDY WITH RAIN, POSSIBLE THUNDERSHOWERS.\r\n\r\n\r\nNNNN\r\n\r\n

我做错线而不是\ r \ n?

2 个答案:

答案 0 :(得分:0)

JSON.stringify()将您的m.content转换为单行json。

因此对white-space: pre-line没有影响。

添加third param(空格数)以进行stringify以便漂亮打印

&#13;
&#13;
$('pre').html(
  JSON.stringify({'a': 1, 'b': 'c'}, null, 4)
);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre></pre>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

我解决了问题:

function formatNtxMessage( m ) {
return '<div class="row">' +
    '<div class="col-lg-9">' +
        '<div class="navtex-message">' +
            m.content + 
        '</div>' +
    '</div>' +          
'</div>';
}

问题是m.content是来自json的字符串值。 :) 谢谢你的帮助。