2

我想从jquery内部将这个带有变量的多行html输出到div中，但它永远不会在div中输出代码块！我只使用其中的变量，即“itemName”。谁能告诉我为什么我的代码不输出 div ？

var siteContents2 ="<li> +
"       <iframe src='<iframe src='http://bsite.com/itemshow.php?"+itemName+"&title=ok&bgcolor=white' height=200 width=200 style='border: none;></iframe><br>+
"        <div class="details">+
"        <div class="title">+
"          <a href="/+itemName/">+itemName</a>+
"        </div>+
"        </div>+
"    </li> ";   

document.getElementById("myDiv").innerHTML += siteContents2;


</script>   
</head>

<body>

    <div id="myDiv"></div>
4

4 回答 4

2

您的引号和连接不正确。尝试这个：

var siteContents2 ="<li>" + 
 "       <iframe src='<iframe src='http://bsite.com/itemshow.php?"+itemName+"&title=ok&bgcolor=white' height=200 width=200 style='border: none;></iframe><br> "+
"        <div class='details'>"+
"        <div class='title'>"+
"          <a href='/"+itemName+"/'>"+itemName+"</a>"+
"        </div>"+
"        </div>"+
"    </li> ";
于 2013-05-10T08:38:59.253 回答
2

从 ES6 开始，您可以将多行变量存储为模板文字，方法是用反引号 (`s) 将它们括起来：

var siteContents2 =`<li> 
       <iframe src='<iframe src='http://bsite.com/itemshow.php?`+itemName+`&title=ok&bgcolor=white' height=200 width=200 style='border: none;></iframe><br>
       <div class='details'>
       <div class='title'>
       <a href='`+itemName+`'>`+itemName+`</a>
    </div>
    </div>
</li> `; 
document.getElementById("myDiv").innerHTML += siteContents2;

更多关于模板文字的信息。

于 2017-02-15T16:50:55.807 回答
1

您的代码中包含错误的引号，因此从技术上讲，它是一个无效字符串，很可能被拒绝。此外，您可以通过以 a 结束每一行来创建多行字符串，\这样您就不必担心这么多引号。

你的代码，重写和工作，可能看起来像这样：

var itemName = "blahblah";
var siteContents2 = "<li>\
       <iframe src='http://bsite.com/itemshow.php?" + itemName + "&title=ok&bgcolor=white' height=200 width=200 style='border: none;'></iframe>\
        <br>\
        <div class='details'>\
            <div class='title'>\
              <a href='" + itemName + "'>" + itemName + "</a>\
            </div>\
        </div>\
    </li>";

document.getElementById("myDiv").innerHTML += siteContents2;

这是代码的jsFiddle：http: //jsfiddle.net/vkaC8/

于 2013-05-10T08:47:12.187 回答
1

您在某些行的末尾缺少一些引号，您可以在 html 中使用单引号 (') 或转义的双引号 (\")。

var siteContents2 ="<li> "+
"       <iframe src='<iframe src='http://bsite.com/itemshow.php?"+itemName+"&title=ok&bgcolor=white' height=200 width=200 style='border: none;></iframe><br>"+
"        <div class='details'>"+
"        <div class='title'>"+
"          <a href='"+itemName+"'>"+itemName+"</a>"+
"        </div>"+
"        </div>"+
"    </li> ";   

document.getElementById("myDiv").innerHTML += siteContents2;
于 2013-05-10T08:39:23.637 回答