编辑：

Question

我正在使用jquery写一个小的ui。

我的网页上有以下html。

<div id= "mystar">
    <div class=" text-center">
            <h4>Iron Man- Movie Rating</h4>
    </div>
    <div class="panel panel-default text-center">
       <div class="panel-body">
         <div class="row">
         <div class="col-sm-3">
         <h4>Rating</h4>
         </div>
         <div class="col-sm-3">
          <input type="number" class="rating" data-size="xs" step="0.5" max="5" min="0" value="0" id="input-3">
        </div>
         </div>
        </div>
    </div>

</div>

当我通过浏览器看到它时，我发现它已扩展到

<div class="text-center "><h4>Iron Man- Movie Rating</h4></div><div class="panel panel-default text-center"><div class="panel-body "><div class="row "><div class="col-sm-3 "><h4>Average Peer Rating</h4></div><div class="col-sm-3 "><div class="star-rating rating-xs rating-active"><div class="clear-rating clear-rating-active" title="Clear"><i class="glyphicon glyphicon-minus-sign"></i></div><div data-content="" class="rating-container rating-gly-star"><div style="width: 40%;" data-content="" class="rating-stars"></div><input style="display: none;" id="input-3 " value="0 " min="0 " max="5 " step="0.5 " data-size="xs " class="rating form-control" type="number"></div><div class="caption"><span class="label label-warning">Two Stars</span></div></div></div></div></div></div>

我希望mystar能够在点击按钮时获取内容。所以我在按钮的单击功能中执行了以下操作。

var starContent = "<div class= "text-center "><h4>Iron Man- Movie Rating</h4></div><div class= "panel panel-default text-center"><div class= "panel-body "><div class= "row "><div class= "col-sm-3 "><h4>Average Peer Rating</h4></div><div class= "col-sm-3 "><input id= "input-3 " value= "0 " type= "number" min= "0 " max= "5 "    step= "0.5 " data-size= "xs " class= "rating "></div></div></div></div>"

并且做了

$('#mystar').html(starContent);

内容没有像我在第一种方法中那样扩展。我认为它与starContent的html相同，并且当我将它直接放在mystar的div中时它不会产生预期的效果。

我应该怎么做才能使它与前一个效果相同。我需要在点击按钮时出现。

Answer 1

那将抛出语法错误，该字符串包含引号，因此您必须将它们用单引号括起来：

    var starContent = "<div class= "text-center "><h4>..."

到

    var starContent = '<div class= "text-center "><h4>...'

<强> When to Use Double or Single Quotes in JavaScript

Answer 2

您需要使用单引号而不是双引号。因为，你的字符串中已经有双引号。这是小提琴http://jsfiddle.net/pratbhoir/2fv0xmub/

var starContent = '<div class= "text-center "><h4>Iron Man- Movie Rating</h4></div><div class= "panel panel-default text-center"><div class= "panel-body "><div class= "row "><div class= "col-sm-3 "><h4>Average Peer Rating</h4></div><div class= "col-sm-3 "><input id= "input-3 " value= "0 " type= "number" min= "0 " max= "5 "   step= "0.5 " data-size= "xs " class= "rating "></div></div></div></div>'

Answer 3

使用：

var starContent = '<div class= "text-center "><h4>Iron Man- Movie Rating</h4></div><div class= "panel panel-default text-center"><div class= "panel-body "><div class= "row "><div class= "col-sm-3 "><h4>Average Peer Rating</h4></div><div class= "col-sm-3 "><input id= "input-3 " value= "0 " type= "number" min= "0 " max= "5 "    step= "0.5 " data-size= "xs " class= "rating "></div></div></div></div>'

编辑：

请找＆＃39;刷新＆＃39;或者＆＃39;渲染＆＃39; stat-plugin / JS的方法。并在html（）调用后调用这些方法。你会得到你想要的。

$('#input-id').rating('refresh')

或尝试

$('#input-id').rating('reset')

HTML div.html（）没有获取内容和呈现

3 个答案:

编辑：