Question

对于li标签我正在动态添加一个带有多个div的div。如下所示。

 var divStr = "";
 divStr = divStr + "<div id='divTaskDetail"+id+"'>";
 divStr = divStr + "<div id='div1"+id+"'>.......</div>";
 divStr = divStr + "<div id='div2"+id+"'>.......</div>";
 divStr = divStr + "<div id='div3"+id+"'>.....<input class='btnSave' type='button' value='Save'  onclick='javascript:SaveTaskDetails(" + id + ")'/></div>";
 divStr = divStr + "<div id='div4"+id+"'>.......</div>";
 divStr = divStr + "</div>";

 $("#liTask"+id+"").append(divStr);

对于“保存”按钮，单击“div3”我只想刷新“div3”区域。即在同一位置重新绑定div3。获取“div3”的代码在

之下

    function SaveTaskDetails(id)
    {
         var CheckDivObj = $("#liTask"+id+"").children();
         var childNode = CheckDivObj.prevObject[0];
         var childTaskNode = childNode.childNodes[1];
         var childSubTaskNode = childTaskNode.children[3];
         if(childSubTaskNode != null)
         {
             $(""+childSubTaskNode.id+"").detach();
         }
    }

我可以在div3中获取childSubTaskNode，但我想删除它并重新绑定在同一位置。这是有效的...... 如果是这样的话，在同一位置拆分和重新绑定的示例代码将会有所帮助提前致谢

Answer 1

一般来说，删除项目并将其放回同一位置的好方法是使用占位符。可能有更好的方法，但这是我想到的。

var item = $('#itemToRemove');
var placeHolder = $('<div id="placeholder"></div>');
placeHolder.insertAfter( item );
item.remove();

//Do Stuff here

item.insertBefore( $('#placeholder') );

Answer 2

我会使用ajax函数来获取新的div内容，然后使用jquery中的html函数来更改要更新的div的html。

$('#div3_save_button').click(function(){
    $.ajax({
        url:'my_script.php',
        type:'post',
        data:'data=some_data',
        success:function(data){
            // the data variable will contain proper html string for content of div 3, returned from my_script.php
            $('#div3').html(data);
        }
    });
});

这样我们就不必删除和替换div3，只需替换div 3的内容。请参阅html here的文档

如何删除div中的div并在同一位置重新绑定它

2 个答案: