2

我正在尝试创建一个 jQuery 函数,我可以使用它访问某些元素并操作它们。到目前为止,我只能访问某些 id 并对其进行操作,但我不知道如何编写一个仅将字符串作为参数的函数,并且我基本上可以将这个函数用于我想要操作的所有元素。

这是我到目前为止所拥有的:

jQuery(document).ready(function () {

// id for the trigger
var trigger = jQuery('#acf-use_right_column');

if (jQuery(trigger).length) {
    // list of ids to be manipulated
    var ids = jQuery('#acf-content_right_column, #acf-show_content, #acf-show_news, #acf-news_header, #acf-show_newsletter_form');
        // toggle element on click to hide/show 
        trigger.find('input:checkbox').click(function() {
            ids.toggle();
        });
        // hide id in dependence of the state of the checkbox
        trigger.find('input:checkbox').each(function(){
            // if checkbox not checked
            if(!jQuery(this).attr('checked')){ 
                ids.hide();
            }
        });     

}

});

它允许我操作一组 id。因此,如果我想在我的文档中操作另一组 id,我将不得不再次编写相同的代码。谁能告诉我如何从这段代码中创建一个接受参数的函数?我只想用我想要操作的 id 作为函数的参数字符串来调用函数。有任何想法吗?

4

3 回答 3

1

比您想象的要简单得多,您可以javascript在函数中使用变量,

 function myNewFunction(parameter1,parameter2){

      var trigger = jQuery(parameter1);
      if (jQuery(trigger).length) {
           // list of ids to be manipulated
           var ids = jQuery(parameter1+', '+parameter2+'_content, '+parameter2+'_news, '+parameter2+'_header, '+parameter2+'_newsletter_form');
           // toggle element on click to hide/show 
           trigger.find('input:checkbox').click(function() {
                ids.toggle();
           });
           // hide id in dependence of the state of the checkbox
           trigger.find('input:checkbox').each(function(){
           // if checkbox not checked
           if(!jQuery(this).attr('checked')){ 
               ids.hide();
           }
       });     
     }
 }

 myNewFunction('#acf-use_right_column','#acf-show');

您甚至可以使用字符串数组并使用类似的东西

 ...
 compare = ids.lenght-1
 for (var key in idArray){
     if(key!=compare){
        string=string+idArray[key]+', '
     }else{
        string=string+idArray[key]
     }
 }
 ids = jQuery(string)
 ...

 idArray = new Array('#id1','#id2','#id3','#id4')
于 2012-06-12T18:10:06.240 回答
1

您所需要的只是一种将 ID 数组转换为 jQuery 可以理解的 ID 选择器的方法。如果您熟悉 jQuery,这并不难。

// Name it whatever you want, 'pancakes' is my 'foo'.
function pancakes(trigger, ids) {
    trigger = $('#' + trigger);
    // `trigger` is a jQuery object already so you don't have to
    // `jQuery(trigger)` here
    if(trigger.length) {
        // This turns `['a','b','c']` into `$('#a,#b,#c')`, the $.map adds the
        // `'#'` prefix to each element of the `ids` array and produces another
        // array with the prefixed `ids`; the `join` sticks the elements of the
        // new array together into a multiple selector.
        ids = $($.map(ids, function(id) { return '#' + id }).join(','));

        // And the rest is as you had it...
    }
}

然后你可以像这样使用它:

pancakes(
    'act-use_right_column',
    ['acf-content_right_column', 'acf-show_content', 'acf-show_news', 'acf-news_header', 'acf-show_newsletter_form']
);

参考:

于 2012-06-12T17:57:57.233 回答
0

please see the code below, It may not be correct but you can use the appraoch

var manipulate=function(tiggerobj, arrayofobj){

// step1 :- use parameter1 fpr id for the trigger
var trigger = jQuery(tiggerobj);

if (jQuery(trigger).length) {
    // list of ids to be manipulated
var ids=new Array();
//step2 :-accumaltae all the ids
for (var ob in arrayofobj){

id.push(jQuery(arrayofobj(ob)));
}


        //step3- toggle element on click to hide/show 
        trigger.find('input:checkbox').click(function() {
            ids.toggle();
        });
        // hide id in dependence of the state of the checkbox
        trigger.find('input:checkbox').each(function(){
            // if checkbox not checked
            if(!jQuery(this).attr('checked')){ 
                ids.hide();
            }
        });     

}

}

Than call this manipulate function where you need

于 2012-06-12T05:30:17.737 回答