Question

我有这个HTML

     var getCreditCardType = function(val) {
        if(!val || !val.length) return undefined;
        switch(val.charAt(0)) {
            case '4': return 'visa';
            case '5': return 'mastercard';
            case '3': return 'amex';
            case '6': return 'discover';
        }
        return undefined;
    }



     var keyupHandler = function() {
         console.log('test')
       $("#credit-card-type li").removeClass("active");
       $("input[id=authorizenet_cc_type]").val('');
       switch(getCreditCardType($(this).val())) {
         case 'visa':
          $('#credit-card-type .VI').addClass('active');
          $("input[id=authorizenet_cc_type]").val('VI');
           break;
         case 'mastercard':
          $('#credit-card-type .MC').addClass('active');
          $("input[id=authorizenet_cc_type]").val('MC');
           break;
         case 'amex':
           $('#credit-card-type .AE').addClass('active');
           $("input[id=authorizenet_cc_type]").val('AE');
           break;
         case 'discover':
           $('#credit-card-type .DI').addClass('active');
          $("input[id=authorizenet_cc_type]").val('DI');
           break;
       };
     };



    $('input#credit-card-type').on('input',keyupHandler);

这个jquery函数

<div class='Aname'>
    <div class='cllt'>
      <img src='../img/close.png' class='cl' />
      <div class='drag'>
        <img src='../img/dr.png' class='dr' /></div>
    </div>
</div>

来源How do I make an element draggable in jQuery?; 我试过这种方式

function handle_mousedown(e){
    window.my_dragging = {};
    my_dragging.pageX0 = e.pageX;
    my_dragging.pageY0 = e.pageY;
    my_dragging.elem = this;
    my_dragging.offset0 = $(this).offset();
    function handle_dragging(e){
        var left = my_dragging.offset0.left + (e.pageX - my_dragging.pageX0);
        var top = my_dragging.offset0.top + (e.pageY - my_dragging.pageY0);
        $(my_dragging.elem)
            .offset({top: top, left: left});
    }
    function handle_mouseup(e){
        $('body')
            .off('mousemove', handle_dragging)
            .off('mouseup', handle_mouseup);
    }
    $('body')
        .on('mouseup', handle_mouseup)
        .on('mousemove', handle_dragging);
}

但它不是拖延它

Answer 1

为您的函数提供第二个参数，指示应该拖动的元素而不是this。

function handle_mousedown(e, elem) {
  var my_dragging = {};
  my_dragging.pageX0 = e.pageX;
  my_dragging.pageY0 = e.pageY;
  my_dragging.elem = elem;
  my_dragging.offset0 = elem.offset();

  function handle_dragging(e) {
    var left = my_dragging.offset0.left + (e.pageX - my_dragging.pageX0);
    var top = my_dragging.offset0.top + (e.pageY - my_dragging.pageY0);
    my_dragging.elem
      .offset({
        top: top,
        left: left
      });
  }

  function handle_mouseup(e) {
    $('body')
      .off('mousemove', handle_dragging)
      .off('mouseup', handle_mouseup);
  }
  $('body')
    .on('mouseup', handle_mouseup)
    .on('mousemove', handle_dragging);
}

$('.dr').mousedown(function(e) {
  handle_mousedown(e, $(this).parent().parent().parent());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class='Aname'>
    <div class='cllt'>
      <img src='../img/close.png' class='cl' />
      <div class='drag'>
        <img src='../img/dr.png' class='dr' /></div>
    </div>
</div>

Jquery调用父元素的函数

1 个答案: