javascript - jQuery .load 复制 div

Question

我正在尝试刷新一个 div 并以重复的 div 结束，即；一个在另一个里面。我目前正在为我的 View 使用 jQuery、Struts2 和 Struts2 jQuery 插件。

目前正在做什么:

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

刷新脚本

<script>
    function reloadContent() {
        $('#nameVolumeWrapper').load('${jsonAction} #nameVolumeWrapper');
    }
</script>

调用刷新脚本的元素

<sj:select href="%{jsonURL}" 
                 id="utility" 
               name="selectedUtility" 
               list="utilityList" 
          headerKey="-1" 
        headerValue="Please Select A Utility"
           onchange="reloadContent()"
     onChangeTopics="reloadSecondList"/>

我正在尝试重新加载的 div

<sj:div id="nameVolumeWrapper" listenTopics="reloadSecondList" 
        effect="pulsate" effectDuration="1000"
        cssStyle="height:250px; overflow-y: scroll; width:910px; 
        margin-left:auto; margin-right:auto;">
<table id="pricingInput" class="footable" style="width: 800px; 
        table-layout: fixed; margin-left: auto; margin-right: auto; 
        margin-bottom:50px;">
    <thead>
        <tr>
            <th style="text-align: center;">Account Name</th>
            <th style="text-align: center;">Annual kWh Volume</th>
            <th style="text-align: center">Rate Class</th>
            <th style="text-align: center;">Add Another?</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><s:textfield name="nameHolder" /></td>
            <td><s:textfield name="volumeHolder" /></td>
            <s:url id="jsonURL" action="jsonAction" namespace="/"/>
                <td>
                    <sj:select href="%{jsonURL}" 
                                 id="rate_class" name="rateHolder" 
                               list="rateClassList" 
                          headerKey="-1" 
                        headerValue="Please Select a RateClass"
                       reloadTopics="reloadSecondList"/>
                </td>
            <td>
                <input type="button" class="addButton" value="Add" />
                <input type="button" value="Delete" onclick="deleteRow(this)">
            </td>
        </tr>
    </tbody>                                    
</table>

长话短说，我该如何修改我的 javascript 或 div 定义，以便在调用 javascript 时 div 不会重复？

Answer 1

你可以这样做:

$.get("${jsonAction} #nameVolumeWrapper", function(data) {
    $('#nameVolumeWrapper').html($(data).html());
});

或者，如果这不起作用，您可以这样做:

var wrapper = $('#nameVolumeWrapper');
wrapper.load('${jsonAction} #nameVolumeWrapper', function() {
   wrapper.children('#nameVolumeWrapper').unwrap();
});