0

当使用 jquery 悬停在超链接上时，我将 div 标签（这个 div 标签在 html 部分中）与另一个 div 标签（这个 div 标签在脚本中）附加在一起。

现在，问题是，当我第一次将鼠标悬停在链接上时加载页面后，它肯定会附加 div 但随后它不会附加 div 标签。所以我只是对它感到困惑。

请帮我解决问题。

在这里，我给出一些代码。

<script id="CollegeInfo" type="text/html">
<div id="${CollegeId}">
    <table width="400px">
    <tr>
        <td colspan="3">
            <div  class="clgname">
            {{html CollegeName}}
            </div>
        </td>
    </tr>
    <tr style='color:Gray;'>
        <td>
        </td>
        <td width="10px">
        </td>
        <td valign="top" style='font-size:12px;'>
            <b>Rating :</b></br>
            <div class="grating"></div> // Div tag with whom I am binding html part div tag...
        </td>
    </tr>
    </table>
</div>
</script>

jQuery部分：

<script type="text/javascript">
$(function(){
    $(".name").mouseover(function (e) {
        var id = $(this).attr("id");

        $.ajax({
            type: "POST",
            url: "College.asmx/GetInfo",
            data: "{'Id':" + id + "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(response) {
                var info = response.d;
                $("#tbodyCollegeInfo").html($("#CollegeInfo").tmpl(info));

                var block_element = $("#rating");
                $('.grating').append(block_element);

                $('#hdndivCollegeInfo').attr("style","display:block;");
            }
        });
    });
});
</script>

HTML部分：

<div id="hdndivCollegeInfo" style="display: none;">
        <div class="hoverpreview">
            <div id="rating" class="rating">
                <asp:Rating ID="rtng" runat="server" BehaviorID="rating" ReadOnly="true" StarCssClass="StarCss"
                    FilledStarCssClass="FilledStarCss" EmptyStarCssClass="EmptyStarCss" WaitingStarCssClass="WaitingStarCss">
                </asp:Rating>
            </div>
            <table>
                <tbody id="tbodyCollegeInfo">
                </tbody>
            </table>
        </div>
    </div>
4

2 回答 2

0 
Don't use html tags inside the script directly. use like this
<script id="CollegeInfo" type="text/html">
var appendHtml=
'<div><table width="400px">
<tr>
        <td colspan='3'>
            <div  class='clgname'>            
            </div>
        </td>
    </tr>
    <tr style='color:Gray;'>
        <td>
        </td>
        <td width='10px'>
        </td>
        <td valign='top' style='font-size:12px;'>
            <b>Rating :</b></br>
            <div class='grating'></div>
        </td>
    </tr>
    </table></div>';

</script> 

In the ajax edit as $('.grating').append(appendHtml);
于 2013-07-12T06:25:03.433 回答
0

尝试这个

        var block_element = $("#rating").outerHtml();
        $('.grating').append(block_element);

编辑：您在页面上收到任何错误吗？它是否达到了 ajax 调用的成功部分？

于 2013-07-12T05:36:26.030 回答