2017-01-20 43 views
0

在我的网站www.HighGamer.com/AOInternational我输入了一个名为Pay with Credit/Debit/Gift card的付款选项,弹出支付网关模式,但是当我尝试点击输入字段以键入付款信息只是可以拖动而不是允许输入。无法点击可拖动模式中的输入字段

是否有任何黑客我可以做,以防止它是可拖动的,而不改变模态代码或有办法解锁输入字段,同时保留可拖动性?先谢谢你们。

我用它当应用于模式使它可拖动

下面是我如何使用它

//load draggables on tukibox 
    $(".tukibox").drags(); 


// Simple JQuery Draggable Plugin 
// https://plus.google.com/108949996304093815163/about 
// Usage: $(selector).drags(); 
// Options: 
// handle   => your dragging handle. 
//      If not defined, then the whole body of the 
//      selected element will be draggable 
// cursor   => define your draggable element cursor type 
// draggableClass => define the draggable class 
// activeHandleClass => define the active handle class 
// 
// Update: 26 February 2013 
// 1. Move the `z-index` manipulation from the plugin to CSS declaration 
// 2. Fix the laggy effect, because at the first time I made this plugin, 
// I just use the `draggable` class that's added to the element 
// when the element is clicked to select the current draggable element. (Sorry about my bad English!) 
// 3. Move the `draggable` and `active-handle` class as a part of the plugin option 
// Next update?? NEVER!!! Should create a similar plugin that is not called `simple`! 

(function($) { 
    $.fn.drags = function(opt) { 

     opt = $.extend({ 
      handle: "", 
      cursor: "move", 
      draggableClass: "draggable", 
      activeHandleClass: "active-handle" 
     }, opt); 

     var $selected = null; 
     var $elements = (opt.handle === "") ? this : this.find(opt.handle); 

     $elements.css('cursor', opt.cursor).on("mousedown", function(e) { 
      if(opt.handle === "") { 
       $selected = $(this); 
       $selected.addClass(opt.draggableClass); 
      } else { 
       $selected = $(this).parent(); 
       $selected.addClass(opt.draggableClass).find(opt.handle).addClass(opt.activeHandleClass); 
      } 
      var drg_h = $selected.outerHeight(), 
       drg_w = $selected.outerWidth(), 
       pos_y = $selected.offset().top + drg_h - e.pageY, 
       pos_x = $selected.offset().left + drg_w - e.pageX; 
      $(document).on("mousemove", function(e) { 
       $selected.offset({ 
        top: e.pageY + pos_y - drg_h, 
        left: e.pageX + pos_x - drg_w 
       }); 
      }).on("mouseup", function() { 
       $(this).off("mousemove"); // Unbind events from document 
       if ($selected !== null) { 
        $selected.removeClass(opt.draggableClass); 
        $selected = null; 
       } 
      }); 
      e.preventDefault(); // disable selection 
     }).on("mouseup", function() { 
      if(opt.handle === "") { 
       $selected.removeClass(opt.draggableClass); 
      } else { 
       $selected.removeClass(opt.draggableClass) 
        .find(opt.handle).removeClass(opt.activeHandleClass); 
      } 
      $selected = null; 
     }); 

     return this; 

    }; 
})(jQuery); 

回答

0

使用

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
修正它 draggable.min.js文件

$(".tukibox").draggable(); 

jQuery的机库可胜过自定义的!

相关问题