SyntaxError：未终止的字符串文字 标记在字符串变量中不起作用

请看我的代码。

var id = 1;
var htmlText = '<div id="horizontalUserPopup"><ul id="tabs1" class="rtabs"></ul><div class="panel-container"><div id="view1"><script>viewMiniProfile("'+id+'",this);</script></div><div id="view2"></div><div id="view3" style="display:none;">Blah Blah Blah</div><div id="view4" style="display:none;">444444</div></div></div>';
$('#contents').html(htmlText);

上面的代码我收到以下错误 -

如果我删除</script>它工作正常。请检查并让我知道。

EDIT:

完整代码 -

function modelInfo(id, username) {
                var pageUrl = $('#pageurl').val();
                $('#model-popup-box1 h3').addClass('newsfeed');
                var content_area = $('#model-popup-content1');
                content_area.html('Please wait...');
                $('#model-popup-box-title1').html('About ' + username);
                $('#model-popup-body1').show();

                content_area.html('<div id="horizontalUserPopup"><ul id="tabs1" class="rtabs"></ul><div class="panel-container"><div id="view1"><script>viewMiniProfile("'+id+'",this);</script></div><div id="view2"></div><div id="view3" style="display:none;">Blah Blah Blah</div><div id="view4" style="display:none;">444444</div></div></div>');

                var innerHtml = "<li><a href=\"#view1\" id='miniprofile-view1' onclick=\"viewMiniProfile('"+id+"',this)\">Mini-Profile</a></li>" +
                        "<li><a href=\"#view2\">Tokens</a></li>" +
                        "<li><a href=\"#view3\">Notes</a></li><li><a href=\"#view4\">PM Logs</a></li>";

                var ul = document.getElementById("tabs1");
                ul.innerHTML = innerHtml;


                $('#horizontalUserPopup').responsiveTabs({
                    rotate: false,
                    startCollapsed: 'accordion',
                    collapsible: 'accordion',
                    setHash: true,
                    disabled: [4, 5]
                });

            }

我假设您引用的代码位于script标签，像这样：

<script>
// ...stuff here...
$('#contents').html('<div id="horizontalUserPopup"><ul id="tabs1" class="rtabs"></ul><div class="panel-container"><div id="view1"><script>viewMiniProfile("'+id+'",this);</script></div><div id="view2"></div><div id="view3" style="display:none;">Blah Blah Blah</div><div id="view4" style="display:none;">444444</div></div></div>');
// ...stuff here...
</script>

如果是这样，问题就出在外层script标签在字符串的中间终止，因为浏览器中的 HTML 解析器不解释 JavaScript 代码，它只是扫描它寻找</script>找出标签结束的位置。所以传递给 JavaScript 解析器的代码是

$('#contents').html('<div id="horizontalUserPopup"><ul id="tabs1" class="rtabs"></ul><div class="panel-container"><div id="view1"><script>viewMiniProfile("'+id+'",this);

...确实有一个未终止的字符串文字。

您可以通过以下方式解决这个问题：

1. 将您的 JavaScript 代码放入.js文件并链接到它，或者

2. 在前面加一个反斜杠/在字符串的结束脚本标记中：

   $('#contents').html('...<script>...<\/script>...');
   

   The \防止浏览器的解析器看到序列</script>，因此它并不认为脚本到此结束。然而，在 JavaScript 字符串中，\/只是/.