Question

我正在尝试将可拖动对象添加到框架中，但是它不起作用并抛出以下异常

使用iframe创建了框架，但无法将可拖动对象应用于框架。请帮助我解决问题。

 Uncaught ReferenceError: HSplitter is not defined at HTMLDivElement.onmousedown

请在下面找到我的代码：

 var HSplitter = {
	
	    mouseDown: function  (_split, event)
	    {
        if(!this.isToggle)
		{
		    this.parent = _split.parentNode.parentNode; //td
			this.currentSplit = _split;
			this.splitterWidth = $(this.currentSplit).getWidth();
            this.splitPointX = Event.pointerX(event);
			this.drag = true;
			this.splitDiv = $(this.parent).getElementsByClassName("HSplitDiv")[0];

            //min width of a parent container couldn't be less than splitter width.
            if( this.minWidth < this.splitterWidth )
                this.minWidth = this.splitterWidth;
            this.mouseOver(_split, event);
            $(this.splitDiv).setStyle({paddingRight: '0px'}); //reset padding


            this._splitDivOverflow(true); //set overflow to ON
        }
	   },
	   mouseUp: function (split, event)
	   {
	    if(!this.isToggle)
		{
			this.drag = false;

            this._setDynamicOverflow();
        }
	    },
       };

         <head>
        <link href="/Work/css/tab_style.css" type="text/css" rel="stylesheet"/>
        <link href="D:/cnsdi-projects/style.css" type="text/css" rel="stylesheet"/>
        <link rel="stylesheet" href="/Work/css/1.10.19/dataTables.bootstrap.min.css">
       <link rel="stylesheet" href="/Work/css/1.10.19/bootstrap.min.css">

        <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> 
       </script>
        <script type="text/javascript" src="/Work/js/3.3.7/bootstrap.min.js"> 
        </script>
    </head>
    <body>
    
    <div class="tab-content" >
        <div id="sectionA" class="tab-pane fade in active" style="overflow:visible;">	
        <iframe  scrolling="yes" src="pg1.html" name="leftside"  style="position:absolute;top:140px;left:0%;width:25%;height:100%;border: none;" ></iframe>
		<div class="split1" onselect="return false;" unselectable="on" onmouseup="HSplitter.mouseUp(this, event);" onmousedown="HSplitter.setMaxMinWidth('-1','-1'); HSplitter.mouseDown(this, event);" style="left: auto;">
		<span class="collapse l-splt-btn" onclick="HSplitter.splitToggle(this);"></span>
		</div>
		<iframe src="pg2.html" name="rightside" scrolling="yes" style="position:absolute;top:140px;left:25%;width:75%;height:50%;border: none;"></iframe>
		<div class="split"><div class="vcollapse d-splt-btn" onclick="VSplitter.splitToggle(this);" toppaneheight="50%" id="idx1320192_vspltbtn"></div></div>
		<iframe src="pg3.html" name="rightside" scrolling="yes" style="position:absolute;top:450px;left:25%;width:75%;height:30%;border: none;"></iframe>
        </div>
         </body>

Answer 1

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/utils/Draggable.min.js"></script>

请在您的网站标题中输入此代码，如果它不起作用，请告诉我。谢谢！

Draggable无法正常工作以获取未捕获的参考错误

1 个答案: