为什么我不能用JQuery .html添加？

Why does this code work:

为什么这段代码有效:

$('div.error_container').html('<div class="error">No more foo allowed</div>');

But this code causes an error:

但是这段代码会导致错误:

$('div.error_container').html('<div class="error">No more foo allowed<br /></div>');

I've tried putting the   before and after the </div> tag, same error. I've tried changing it from   to  . Chrome always says the following in the inspector:

我已经尝试将
放在标签之前和之后,同样的错误。我已经尝试将它从
更改为
。 Chrome始终在检查器中说明以下内容:

Uncaught SyntaxError: Unexpected token ILLEGAL

4 个解决方案

#1

Try breaking it up into a chain:

尝试将其分解为链:

var $div = $('<div class="error"></div>').html('No more foo allowed')
                                         .append('<br />');
$('div.error_container').html($div);

#2

This works perfectly for me:

这对我很有用:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
  $('div.error_container').html('<div class="error">No more foo allowed<br /></div>');
});
</script>
</head>
<body>
<div class="error_container">
</div>
</body>
</html>

in Chrome and Firefox. What version of jQuery are you using?

在Chrome和Firefox中。你使用的是什么版本的jQuery?

On a side note   is XML (including XHTML) not HTML. HTML is  .

旁注是
是XML(包括XHTML)而不是HTML。 HTML是
。

#3

I tried the following SSCCE and it works flawlessly in IE, FF, Safari, Opera and Chrome (all of the most recent versions).

我尝试了以下SSCCE,它在IE,FF,Safari,Opera和Chrome(所有最新版本)中都能完美运行。

So your problem is likely related with the doctype you declared or using an old version of Chrome.

因此,您的问题可能与您声明的文档类型或使用旧版Chrome有关。

<!doctype html>
<html lang="en">
    <head>
        <title>SO question 2173556</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script>
            $(document).ready(function() {
                $('#foo').html('<div>foo<br>foo</div>');
                $('#bar').html('<div>bar<br/>bar</div>'); // Yes, that's illegal in HTML strict. Just to test :)
            });
        </script>
        <style>

        </style>
    </head>
    <body>
        <div id="foo"></div>
        <div id="bar"></div>
    </body>
</html>

#4

I also had a similar issue, not sure if it is relevant. I was doing c# mvc for a cms.

我也有类似的问题,不确定它是否相关。我正在为cms做c#mvc。

So i had some html input from user and i display them using "@Html.Raw(Modal.Content)"

所以我有一些来自用户的html输入,我使用“@ Html.Raw(Modal.Content)”显示它们

Inside the Modal.Content there was a   and i had issue appending that content into the html using jquery .html("@Html.Raw(Modal.Content)")

在Modal.Content里面有一个
我有问题使用jquery .html(“@ Html.Raw(Modal.Content)”)将该内容附加到html中

But in the end the issue was not  

但最终问题不是

There is an invisible \n so i did .html("@Html.Raw(Modal.Content).Replace("\n", "")") and the issue was solved. The   remained in my content and it work as expected.

有一个看不见的\ n所以我做了.html(“@ Html.Raw(Modal.Content).Replace(”\ n“,”“)”)问题解决了。
仍保留在我的内容中,并且按预期工作。

#1