Question

我试图将2个变量合并为1，经典书籍方式

a = 1;
b = "bla";
c = a + b;

但是，当其中一个变量，有html（）jquery函数时，结果只有这个变量，仅此而已。为什么是这样？在这种情况下我该怎么办？

所有JS代码

    $("#target").click(function() {
$('#myTable tr:last').after('<tr><td>Bla</td><td><div class="remove">REMOVE</div></td></tr>');
});
$("#myTable").on('click', '.remove', function(event) {
  $(this).parent().parent().remove();
});

$("button").click(function() {
  var input = $("input").val();
  var table = $("#myTable").html();
  var output = input + "www" + table;
  $(".result").html(output);
});

相关代码：

$("button").click(function() {
  var input = $("input").val();
  var table = $("#myTable").html();
  var output = input + "www" + table;
  $(".result").html(output);
});

html输出仅打印表内容，但不打印其他变量。组合vars肯定有效，但如果有html（）。在其中一个中，只打印此var。这是什么来源？

http://jsbin.com/ucopun/9/edit

要查看它不起作用，请在输入中键入内容并单击结果。

Answer 1

.html()从DOM节点设置和检索HTML;不要与.text()混淆，后者处理节点内的文本值。

你可能想做这样的事情：

 var input = '<div>' + $("input").val() + 'www</div>';
 var table = $("#myTable").html();
 var output = input + '<table>' + table + '</table>;

坦率地说，我认为你的HTML太复杂了;你为什么把div放在桌子里？您可以减少代码并使其仅与div一起使用。

Answer 2

问题是$("#myTable").html();返回你的表格html而没有开始和结束标记<table></table>所以当你以后将文本连接到已完成的html表代码时，浏览器会解释你的文本属于表但是不知道怎么渲染它。

简单的解决方案是输出一个合适的表格，以便正确显示文本并与表格分开，这样做，只需替换以下行：

var table = $("#myTable").html();

这个：

var table = '<table>' + $("#myTable").html() + '</table>';

Answer 3

您在输出变量中放入的所有文本都存在，问题是$(".result").html(output)忽略了非HTML内容。通过添加此警报证明自己：

$("button").click(function() {
  var input = $("input").val();
  var table = $("#myTable").html();
  var output = input + "www" + table;
  alert(output);
  $(".result").html(output);
});

Answer 4

查看来源（或在警告框中显示output的值）。

$("button").click(function() {
  var input = $("input").val();
  var table = $("#myTable").html();
  var output = input + "www" + table;
  alert (output);
  $(".result").html(output);
});

您可以看到输入字段中的值和'www'被添加到结果div的html中;它只是没有渲染。

考虑使用id属性而不是类来定义.html(output)的目标：

<div id="result">...</div>

和

$("#result).html(output);

jquery .html（）函数杀死其他一切

4 个答案: