JS中的HTML - 引用错误

Question

getFeederInfoWindow: function (i) {
    var windowContent = "<button onclick='feeders.getFeederLoadingData(" + i + ",'summer')\">Summer</button>"
}

方法签名基本上是：feeders.getFeederLoadingData: function (i, selectedSeason)

加载HTML页面后，Chrome检查会显示<button>呈现如下：

渲染： <button onclick="feeders.getFeederLoadingData(203," summer')">Summer</button>

但这就是我想要的：

渴望 <button onclick="feeders.getFeederLoadingData(203,'summer')">Summer</button>

有点令人尴尬的问题，但我无法弄清楚我是如何弄乱报价的。

谢谢。

Answer 1

“onclick”之后的引用只是一个引用。那应该做的工作：

getFeederInfoWindow: function (i) {
    var windowContent = "<button onclick=\"feeders.getFeederLoadingData(" + i + ",'summer')\">Summer</button>";
}

Answer 2

您尝试使用'开始属性值，然后使用"结束。

正确嵌套你的报价。

更好的是：不要通过粉碎字符串来生成HTML。使用createElement，addEventListener和朋友。

Answer 3

您似乎错过了onclick属性的起始引号：

"<button onclick='\"feeders.getFeederLoadingData(" + i + ",'summer')\">Summer</button>"
//                ^
//          THIS WAS MISSING

通常，将DOM元素分开是一个好主意。他们的标记行为。这可以做到：

• Using jQuery：

  $("<button>Summer</button>").on('click', function () { ... });
  

• Without using jQuery：

  var button = document.createElement('button');
  button.innerHTML = "Summer";
  button.onclick = function () { ... };
  

Answer 4

您尝试使用单引号作为内嵌javascript，如下所示

var windowContent = "<button onclick='feeders.getFeederLoadingData(i,'summer')' >Summer </button>";