即使我没有引号来转义，它仍然说我有一个未闭字符串(Jquery)

Even when I have no quotes to escape, it still says I have an unclosed string (Jquery)

本文关键字：有一个 字符串 Jquery 转义      更新时间：2023-09-26

我使用find函数来完全确定没有需要转义的引号。要放入我的"viewbox"div的html完全是单引号，我用双引号包围它。无一例外。当我删除我试图插入的东西，并用一个简单的"测试"替换它时，它工作得很好，所以它似乎不是一个库问题，或者类似的东西。此外，代码本身，我试图插入工作时，我保存为html文件。我几乎可以肯定我忽略了什么。我试过了，找过了，做过了我能想到的一切。下面是javascript代码。

EDIT:我把所有的代码行放在一行。它是有效的，但不是呈现一个引导旋转木马，它只是一次显示所有的图像，一个接一个。

$(document).ready(function () {
$('#aprilissue').click(function () {
$('#viewbox').html(
    "
<div class='row'>
<div class='col-md-2'>
</div>
<div class='col-md-8'>
<center>
<div id='carousel-example-generic' class='carousel slide' data-interval='false'>
  <!-- Wrapper for slides -->
  <div class='carousel-inner'>
    <div class='item active'>
      <img src='img/april/page01.jpg' alt='>
    </div>
<div class='item'>
      <img src='img/april/page02.jpg' alt='>
    </div>
<div class='item'>
      <img src='img/april/page03.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page04.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page05.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page06.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page07.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page08.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page09.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page10.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page11.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page12.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page13.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page14.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page15.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page16.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page17.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page18.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page19.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page20.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page21.jpg' alt='>
    </div>
    <div class='item'>
      <img src='img/april/page22.jpg' alt='>
    </div>
  </div>
  <!-- Controls -->
  <a class='left carousel-control' href='#carousel-example-generic' data-slide='prev'>
    <span class='icon-prev'></span>
  </a>
  <a class='right carousel-control' href='#carousel-example-generic' data-slide='next'>
    <span class='icon-next'></span>
  </a>
</div>
</div>
<div class='col-md-2'>
</div>
</center>
"
    );
});

//when I remove what's above, the code below works.

$('#mayissue').click(function () {
$('#viewbox').html(
"test2"
    );
});
$('#juneissue').click(function () {
$('#viewbox').html(
"test3"
    );
});
$('#julyissue').click(function () {
$('#viewbox').html(
"test4"
    );
});
    });

不能有多行字符串

要解决这个问题，使用单独的字符串连接:

$('#viewbox').html("<div class='row'>" +
               "<div class='col-md-2'>" +
               "</div>") //... etc.

你不能让一个字符串像这样跨越多行，要让它那样工作你必须做这样的事情

 $('#viewbox').html("<div class='row'>" +
"<div class='col-md-2'>" + .....

说了这些，然后我将添加。不要那样添加HTML

使用模板，或者其他任何东西，而不是你发布的。一种非常便宜和简单的方法是在页面上创建html并使用css将其标记为display: none，然后在JS中引用父对象并传递outerHtml.

编写长多行字符串的好方法是在每行末尾使用神奇的反斜杠'。JS和你都会很开心的:

$('#viewbox').html("'
    <div class='row'>'
    <div class='col-md-2'>'
    </div>'
    ................ '
    <div class='col-md-2'>'
    </div>'
    </center>'
");

CONCEPT JSFIDDLE DEMO

相关文章：