Question

我拖放了3个div（div标签）。一个div标记包含object标记中的div标记，该对象标记中显示PDF文件。当页面加载object代码显示的PDF文件时，拖放object代码后不会显示pdf文件，object代码为空。

HTML CODE

       /* Display Box1*/
        <div class="parent">
         <div class="box child" id="child3">
         <div class="box-header">
         <h3 class="box-title">Information From Document Archive</h3>
         </div>
         <div class="box-body table-responsive no-padding" style="overflow: auto; padding-left: 5px; max-height: 250px;">
         <div style="z-index: -999;">
        <object data="file/DRAG.pdf" id="objpdf" class="col-sm-12">
         </object>
         </div>
        </div>
        </div>
    </div>
/* Display Box2 */
<div class="row">
<div class="col-sm-6">
<div class="parent">
<div class="box child" id="child1">
<div class="box-header">
<h3 class="box-title">Information From AI Engine</h3>
<div class="box-tools">
<div class="input-group input-group-sm" style="width: 150px;">
</div>
</div>
</div>
<div class="box-body table-responsive no-padding" style="overflow: auto; max-height: 300px;">
<table class="table table-hover">
<tbody>
<tr>
<th style="width: 200px;">Field</th>
<th>Value</th>
</tr>
<tr>
 <td>Permission Note</td>
 <td><span class="text-red">
 <asp:Label ID="lblPermissionNote" runat="server" Text="abcd"></asp:Label>
 </span></td>
 </tr>
 <tr>
 <td>Customer Comments</td>
 <td><span class="text-red">
 <asp:Label ID="lblCustomerComments" runat="server" Text="Test comments"></asp:Label>
</span></td>
</tr>
 </tbody>
 </table>
</div>
</div>
</div>
  </div>

 <div class="col-sm-6">
 <div class="parent">
 <div class="box child" id="child2">
 <div class="box-header">
 <h3 class="box-title">Information From Mainframe Engine</h3>
<div class="box-tools">
<div class="input-group input-group-sm" style="width: 150px;">
</div>
</div>
</div>
<div class="box-body table-responsive no-padding" style="overflow: auto; height: 300px;">
<table class="table table-hover">
<tbody>
<tr>
<th>Field</th>
<th>Value</th>
</tr>
<tr>
<td>Consignment Number</td>
<td><span class="text-black">
<asp:Label ID="lblMainFrameConsigmentNumber" runat="server" Text="1234556789"></asp:Label>
</span></td>
</tr>
<tr>
<td>Account Number</td>
<td><span class="text-black">
<asp:Label ID="lblMainFrameTntAccountNumber" runat="server" Text="123456"></asp:Label>
</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>                               
</div>

JQuery代码

$("document").ready(function () {
            $(".child").draggable({
                revert: true
            });
            $(".parent").droppable({
                accept: '.child',
                drop: function (event, ui) {
                    if ($(this).children().length > 0) {
                        var move = $(this).children().detach();
                        $(ui.draggable).parent().append(move);
                    }

                    $(this).append($(ui.draggable));
                }
            });
        });

CSS

.parent {
         /*float: left;*/
         cursor: move;
         border: 2px dotted silver;
    }

拖动前的网页

拖动后的网页

请建议任何解决方案。

Answer 1

找到解决方案。我没有使用<object>标记，而是使用<iframe>标记。它对我有用。

<强>之前：

<object data="file/DRAG.pdf" id="objpdf" class="col-sm-12">
         </object>

更改为：

<iframe src="file/DRAG.pdf" class="col-sm-12" style="height:300px;" frameborder="0"></iframe>

拖放<object>标记，asp.net中<object>标记中缺少数据

拖动前的网页

1 个答案: