Question

我有两个班级：

offcanvas-menu-selector和sub-navigation。默认情况下，sub-navigation的左侧值为left:-250px。我想点击left:0px

后将此值更改为offcanvas-menu-selector

我尝试了以下内容：

$('.offcanvas-menu-selector').onclick(function(){
    $('.sub-navigation').css({left: 0, position:'absolute'});
});

但它不起作用。给我一个错误： Uncaught TypeError: undefined is not a functionjquery.js:33 (anonymous function)jquery.min.js:2 jjquery.min.js:2 k.fireWithjquery.min.js:2 m.extend.readyjquery.min.js:2 J

我该怎么做？

Answer 1

$('.offcanvas-menu-selector').click(function(){
    $('.sub-navigation').css({left: 0, position:'absolute'});
});

<强>解释

onclick在jQuery中不存在。它是你click之后的事。

http://api.jquery.com/click/

修改

虽然这现在有效，并且您使用javascript / jQuery成功设置CSS属性，但我不推荐它。我更喜欢将函数（js），样式（css）和标记（html）尽可能分开。

话虽如此，我更喜欢这种方法：

<强> CSS：

.myClass
{
   left: 0;
   position: absolute;
}

<强> JS：

$('.offcanvas-menu-selector').click(function(){
    $('.sub-navigation').toggleClass('myClass');
});

<强>解释

您现在只是使用jQuery来切换类，但在样式表中包含此类的所有属性。更整洁。在线/在jQuery中定义样式很可能会让你头疼。这种方法还解决了您在评论中提出的问题。

Answer 2

jQuery中没有onclick函数。相反，您可以使用.click()方法，或者，如果您的元素在加载页面中没有机会，您可以使用.on()并委派点击事件：< / p>

$('body').on("click",".offcanvas-menu-selector", (function(){
    $('.sub-navigation').css({left: 0, position:'absolute'});
});

如何使用jquery更改左值

2 个答案:

修改