JQuery flippy插件在Click事件上未触发

使用jQuery Flippy插件的flippy插件标签有一个小问题http://blog.guilhemmarty.com/flippy/

我有一个带p标签的div

 

Some text Some text

和我的页面上的事件处理程序

 $("#aID").click(function(){ var content = $("#divID").html(); $("#divID").flippy({ direction:"LEFT", duration: "500", verso: content }); }); 

问题是,当我单击元素来翻转div时,div会被翻转,但是clickfunction不会处理另一次点击。

我只能翻转div一次。 当我将“a”元素放在div之外时,只要我愿意,我就可以翻转,但这不是我的目标。

任何人都可以建议我。

因为在翻转div后我在div中注册的所有事件监听器都不可用,所以我在翻转后再次注册这些监听器

 $(document).on("click", "#element", function(){ do something}); 

即:

在我的JSP中:`$(document).ready(function(){

 $("#register").click(function() { switchRegister(); }); $("#forgPass").click(function() { forgPass(); }); });` 

在.js文件中:

/ * *将登录屏幕切换到注册屏幕* /

function switchRegister(){var mainContent = $(“#LoginBox”)。html();

 $("#btnLogIn").prop('value', regText); $("#regProfile").hide(); $("#regPass").hide(); $("#iconName").show(); $("#regText").show(); $("#goBack").show(); var content = $("#LoginBox").html(); $("#LoginBox").flippy({ direction:"LEFT", duration: "500", verso: content, onFinish: function() { $("#goBack").on("click", function(){ $("#LoginBox").empty(); backToLogin(mainContent, "right"); }); } }); 

}

/ * *返回登录屏幕* /

function backToLogin(内容,方向){

 if(direction == "right") { console.log("direction RIGHT"); $("#LoginBox").flippy({ direction:"RIGHT", duration: "500", verso: content, onFinish: function(){ $(document).on("click", "#register", function(){ switchRegister(); }); $(document).on("click", "#forgPass", function(){ forgPass(); }); } }); } else { console.log(" direction Bottom"); $("#LoginBox").flippy({ direction:"BOTTOM", duration: "500", verso: content, onFinish: function(){ $("#register").on("click", function(){ switchRegister(); }); $("#forgPass").on("click", function(){ forgPass(); }); } }); } 

}

/ * *忘记密码* / function forgPass(){

 var mainContent = $("#LoginBox").html(); $("#btnLogIn").prop('value', passText); $("#regPass").hide(); $("#regProfile").hide(); $("#iconPass").hide(); $("#regText").hide(); $("#goBack").show(); var content = $("#LoginBox").html(); $("#LoginBox").flippy({ direction:"TOP", duration: "500", verso: content, onFinish: function() { $("#goBack").on("click", function(){ $("#LoginBox").empty(); backToLogin(mainContent, "bottom"); }); } }); 

}

尝试jQuery FlipGit Hub URL