JavaScript/jQuery制作触发器的麻烦

所以，我只是想在触摸一个元素时从其位置到另一个元素，当我点击一个按钮。然后，如果我再次点击该按钮，我希望它回到原来的位置。我有这个代码。JavaScript/jQuery制作触发器的麻烦

$(document).ready(function() { 
    $('.trigger').click(function() { 
    $('.trigger').toggle(
     function() { 
      $('.mod').css({'margin-left':'0px'}); 
      }, 
     function() { 
      $('.mod').css({'margin-left':'-100px'}); 
      } 
     ); 
    }); 
});

当我按下按钮时，元素做我想要的。但按钮消失。我不太确定，这个元素会被触发回来。
现在我只想要一个可以完成这项工作的工作代码。

来源

2015-04-23 Feint

，如果你能创造你做了什么小提琴，它会有助于充分为社会来帮你。 http://doc.jsfiddle.net/tutorial.html – Robin

你可以显示'.trigger'的html。 –

[jQuery的'.toggle（）']（http://api.jquery.com/toggle/）不知道如何处理两个回调。您的版本是否由插件提供？你期望它做什么？ – blgt

.toggle()隐藏并显示目标元素，所以你需要别的东西。一种方法是，只是为了检查元素的margin-left：

$(document).ready(function() { 
    $('.trigger').click(function() { 
     alert($('.mod').css('margin-left')); 
     if($('.mod').css('margin-left') == '0px') { 
      $('.mod').css('margin-left', '-10px'); 
     } 
     else { 
      $('.mod').css('margin-left', '0px'); 
     } 
    }); 
});

Fiddle

来源

2015-04-23 11:29:32 janatuerlich

这个怎么样

$(document).ready(function() { 
    $('.trigger').click(function(event) { 
    event.preventDefault(); 
    if ($(this).hasClass("isLeft")) { 
     $(".mod").stop().css({'margin-left':'0px'});        
    } else { 
     $(".mod").stop().css({'margin-left':'50px'}); //given +50px because it disappears when -50px is given 
    } 
    $(this).toggleClass("isLeft"); 
    return false; 
    }); 
});

DEMO FIDDLE

来源

2015-04-23 11:34:52

如果你正在使用jQuery 1.9或后来的问题是.toggle()事件处理方法被删除从图书馆出售。

您可以实现自己的切换：

$(document).ready(function() { 
    $(".trigger").click(function() { 
    var f = !$(this).data("toggleFlag"); 
    if (f) { 
    $('.mod').css({'margin-left':'0px'}); 
    } else { 
    $('.mod').css({'margin-left':'-100px'}); 
    } 
    $(this).data("toggleFlag", f); 
}); 
});

它使用.data()方法，以保持一个布尔标志的轨道指示执行其代码。

DEMO FIDDLE

来源

2015-04-23 11:39:01 Pawan

需要toggle，.mod不.trigger

$(document).ready(function() { 
    $('.trigger').click(function() { 
    $('.mod').toggle(
     function() { 
     $('.mod').css({'margin-left':'0px'}); 
     }, 
     function() { 
     $('.mod').css({'margin-left':'-100px'}); 
     } 
    ); 
    }); 
});

Demo

来源

2015-04-23 11:51:22 ozil

JavaScript/jQuery制作触发器的麻烦

回答

相关问题