从选项卡将内容加载到div中

Question

我试图使用一个包含html代码段的php变量，以在单击<li>时在div内显示。 如果变量仅包含没有html的文本字符串，则下面的代码有效。 但是，一旦我添加html，它就会停止工作。 我究竟做错了什么？

我已经根据下面收到的帮助更新了代码，但是仍然无法正常工作。

这有效：

$(function() {
            $('#tab-1').click(function() {
                    alert('click event called!'); var tabcontent = "Test Content";
                    document.getElementById('top-tabs-content').innerHTML = tabcontent;
            });
            });

这不是：

$(function() {
            $('#tab-1').click(function() {
                    alert('click event called!'); var tabcontent = "<?php echo json_encode($tabcontent[0]);?>";
                    document.getElementById('top-tabs-content').innerHTML = tabcontent;
            });
            });

Answer 1

尝试更换

var tabcontent = "<?php echo $tabcontent[1]; ?>"

同

var tabcontent = "'" + "<?php echo $tabcontent[1]; ?>" + "'";

Answer 2

找到解决方案！ preg_replace和addlashes可以使javascript正确。 问题是变量内的html是多行，在JS函数中不起作用。 这是在不破坏JS变量的情况下将JS变量设置为PHP变量的方法：

var tabcontent = "<?php echo preg_replace("/\r?\n/", "\\n", addslashes($tabcontent[1]));?>";