[英]Function to change CSS of nested submenu not working (jQuery)
I'm attempting to create a slide-in menu for a mobile website which has nested submenus that also slide in over the primary parent menu. 我正在尝试为具有嵌套子菜单的移动网站创建幻灯片菜单,该子菜单也可以在主父菜单上滑动。 This is done by editing the
right
style attribute to move each menu off & on screen. 这是通过编辑
right
样式属性以在屏幕上和屏幕上移动每个菜单来完成的。
Everything is working properly except that once I open a submenu, the function that's supposed to close the submenu is changing the CSS. 除了打开子菜单后,所有正常工作之外,应该关闭该子菜单的功能正在更改CSS。 The function that contains this instruction itself is executing (as evidenced by a console.log), but the line that edits the CSS is not working.
包含该指令本身的函数正在执行(由console.log证明),但是编辑CSS的行不起作用。
Here is the function that is having trouble: 这是有问题的功能:
$(document).ready(function(){
$('.close-sub-menu').click(function(){
$(this).parent().css("right", "-425px");
console.log("this line is logging correctly");
});
});
Interestingly enough, if I attempt to edit the CSS of background-color
or left
, it will work. 有趣的是,如果我尝试编辑
background-color
或left
的CSS,它将起作用。 But right
will not work. 但是
right
将行不通。
I've tried using addClass
and removeClass
instead, referencing the parent's class name directly instead of using this
, and inline function calls, but none of it has seemed to work. 我尝试使用
addClass
和removeClass
代替,直接引用父类的类名而不是使用this
和内联函数调用,但是似乎都没有用。 I think it is either a scoping issue, or perhaps some interference with the parent menu. 我认为这是一个范围问题,或者可能是对父菜单的干扰。 Either way, I'm not able to figure it out.
无论哪种方式,我都无法弄清楚。
Here is a simple example of my problem in a JSFiddle: https://jsfiddle.net/wk4wwfer/2/ 这是我在JSFiddle中遇到的问题的简单示例: https ://jsfiddle.net/wk4wwfer/2/
JQuery is very acceptable. jQuery是非常可以接受的。
Your $('.slide-menu-sub-parent').click
function is still firing when you click the close button. 当您单击关闭按钮时,您的
$('.slide-menu-sub-parent').click
函数仍处于触发状态。
Update your close function to be: 将您的关闭功能更新为:
$('.close-sub-menu').click(function(e){
e.stopPropagation(); //Prevents the click event from bubbling up and triggering the other click events registered
$(this).parent().css("right", -425);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.