Question

我想在Colorbox插件中显示一个div，但它不起作用，因为div元素中有很多双引号并导致问题所以我该怎么做。

这是我的代码

@event.interests

正如您所看到的，有很多双引号并且括号不同步。

Answer 1

问题是当你用双引号（＆＃34;）开始一个字符串并在字符串中放置另一个引号时，JS认为你结束了字符串。这就是必须转义必须在字符串中引用的原因：\"

示例：var x = "En then he said: \"Hi there\", with a big smile";

此外，JS不喜欢换行符。如果你需要它，你必须逃避这些，但更好的方法是将字符串分成多个字符串

示例：

var x = "this is" +
"A multiline" + 
"String.";

你的代码逃脱得很好，必须是这样的：

<script>
    $(document).ready(function() {
        if(localStorage.getItem('welcomehelloState') != 'shown'){
            function openColorBox(){
                $.colorbox({transition: "fade", top: "2%", width:"67%", height:"17%", html: "<section class=\"related\">" +
                "<p>New Content:-</p>" +
                "<a href=\"/part-2/index\">" +
                        "<img src=\"img/related/Prdha.png\" />" +
                        "<h3>Art</h3>" +
                        "</a>" +
                        "<a href=\"/part-2/index6\">" +
                        "<img src=\"img/related/Kavi.png\" />" +
                        "<h3>Games</h3>" +
                        "</a>" +
                        "</section>"});
            }
            setTimeout(openColorBox, 100);
            localStorage.setItem('welcomehelloState','shown')
        }
    });
</script>

Answer 2

如果你正在使用Jquery并制作html，那么请确保没有输入行，因为jquery不接受这个并且它会产生语法错误。以这种方式使用你的代码..

$.colorbox({transition: "fade", top: "2%", width:"67%", height:"17%", html: '<section class="related"><p>New Content:-</p><a href="/part-2/index"><img src="img/related/Prdha.png" /><h3>Art</h3></a><a href="/part-2/index6"><img src="img/related/Kavi.png" /><h3>Games</h3></a></section>'});

谢谢：）

如何在colorbox中显示div - Jquery插件

2 个答案: