如何像在javascript中调用jquery函数

时间:2021-02-26 01:24:57

I have this jQuery function:

我有这个jQuery函数:

$('.scrollToLoginBox').click(function(){
    $('html, body').animate({scrollTop: $("#LoginBox").offset().top-5}, 'slow');                
});

I don't want it as a class, I'd like to be able to call it like this: onClick="scrollTo(id);"

我不希望它作为类,我希望可以这样调用:onClick="scrollTo(id) "

So, how can I put the function in javascript format:

那么,如何将函数转换为javascript格式呢?

function scrollTo(id){
    $('html, body').animate({scrollTop: $("#'+id+'").offset().top-5}, 'slow');
}

EDITED by publisher:

编辑出版:

I don't hate you guys ;o) I appreciate all your answers, but I'm not trying to get the id. On the other hand, I'm trying to build the same function I published above. So, that on a click I will send the id (which I have Ex. Login or LoginBox), so that the function will scroll slowly to the anchor (id=Login or LoginBox).

我不讨厌你们这些人;o)我欣赏你们所有的答案,但我不是想要得到id。因此,在单击时,我将发送id(我已经有了,Login或LoginBox),以便该函数将慢慢滚动到锚点(id=Login或LoginBox)。

Now I have to call it like this: class="scrollToLoginBox", instead I'd like to call it onClick="scrollTo('LoginBox');

现在我必须这样调用它:class="scrollToLoginBox",我想将它命名为onClick="scrollTo('LoginBox');

I have 20 identical functions like the above, one for each id. Another example of what I have and I don't want is: class="scrollToSettings", instead I'd like to call it onClick="scrollTo('LoginBox'); or onClick="scrollTo('Settings');

我有20个和上面一样的函数,每个id一个,另一个我不需要的例子是:class="scrollToSettings",我想把它命名为onClick="scrollTo('LoginBox');或onClick = " scrollTo('设置');

            $('.scrollToSettings').click(function(e){
        $('html, body').animate({scrollTop:$("#settings").offset().top-5}, 'slow');         
        return false;       
    });

    $('.scrollToFaqs').click(function(e){
        $('html, body').animate({scrollTop:$("#formCode").offset().top-5}, 'slow');         
        return false;       
    });

I would like only one function that takes the id. I just don't know how to pass the id to this jQuery function ;o)

我只需要一个函数来获取id,只是不知道如何将id传递给这个jQuery函数;o)

1 个解决方案

#1


8  

If you want to pass id to item being clicked, then you need to use this.id

如果要将id传递给被单击的项,则需要使用this.id

Live Demo

现场演示

onClick="scrollTo(this.id);"

If you want to pass id of some other control then you simple pass the id as string.

如果想要传递其他控件的id,那么只需将id作为字符串传递。

onClick="scrollTo('idOfHTMLElement');"

Edit based on comments, for passing values from html elements to javascript function.

根据注释进行编辑,以便将值从html元素传递到javascript函数。

Data attributes are used for hold custom attributes and could be accessed in jQuery function use data() function.

数据属性用于保存自定义属性,可以在jQuery函数中使用Data()函数访问。

Html

Html

<div class="scrollToCal" data-idtopass="Anchor">click me to go to Anchor</div>​

Javascript

Javascript

jQuery(document).ready(function($) {

    $('.scrollToCal').click(function() {

        $('html, body').animate({
            scrollTop: $('#' + $(this).data('idtopass')).offset().top - 5
        }, 'slow');
        return false;
    });

});​

#1


8  

If you want to pass id to item being clicked, then you need to use this.id

如果要将id传递给被单击的项,则需要使用this.id

Live Demo

现场演示

onClick="scrollTo(this.id);"

If you want to pass id of some other control then you simple pass the id as string.

如果想要传递其他控件的id,那么只需将id作为字符串传递。

onClick="scrollTo('idOfHTMLElement');"

Edit based on comments, for passing values from html elements to javascript function.

根据注释进行编辑,以便将值从html元素传递到javascript函数。

Data attributes are used for hold custom attributes and could be accessed in jQuery function use data() function.

数据属性用于保存自定义属性,可以在jQuery函数中使用Data()函数访问。

Html

Html

<div class="scrollToCal" data-idtopass="Anchor">click me to go to Anchor</div>​

Javascript

Javascript

jQuery(document).ready(function($) {

    $('.scrollToCal').click(function() {

        $('html, body').animate({
            scrollTop: $('#' + $(this).data('idtopass')).offset().top - 5
        }, 'slow');
        return false;
    });

});​