Повторно использовать функцию jquery?

Question

У меня есть эта функция, я хотел бы использовать ту же функцию для 3 других разделов на той же странице.

Я пытался поставить "это" и ближе всего, но это не работает правильно. Есть мысли?

У меня есть UL с классом «Содержать». Я также заключил каждый раздел в свой собственный div «subSet», чтобы он стал «родительским».

//Sign Up Favorites Function For Clicking
   $('.popular-list li a').live("click",function() //this will apply to all anchor tags
        { 
                var stuff = $(this).text();
                        var hasDuplicate = false;

      $('ul.contain li').each( function(){
       if ($(this).text() === stuff ){
          hasDuplicate = true;
          return false;
       }
    });

    if (hasDuplicate ) {
    $("#error").queue(function () {
        $(this).fadeIn(500);
        $(this).html('You Have Already Added '+stuff);
        $(this).animate({opacity: 1.0}, 2000)
        $(this).fadeOut(1500);
        $(this).dequeue();
      });





        } 
    else {         
       $('ul.contain').append('<li title="Delete '+ stuff + '">'+stuff+'</li>'); 
          }
    });

      //Sign Up Favorites Function For Adding Custom   
      $('a.addnew').live("click",function() //this will apply to all anchor tags
        { 
                        var newstuff = $("#create-new-drink").val();
                        var hasDuplicate = false;

      $('ul.contain li').each( function(){
       if ($(this).text() === newstuff ){
          hasDuplicate = true;
          return false;
       }
    });

    if (hasDuplicate ) {
        $("#error").queue(function () {
        $(this).fadeIn(500);
        $(this).html('You Have Already Added '+newstuff);
        $(this).animate({opacity: 1.0}, 2000)
        $(this).fadeOut(1500);
        $(this).dequeue();
      });
     } 
           else if(newstuff === '') {  $("#error").queue(function () {
            $(this).fadeIn(500);
            $(this).html('The Box is Empty');
            $(this).animate({opacity: 1.0}, 2000)
            $(this).fadeOut(1500);
            $(this).dequeue();
          });
     }
        else {         
           $('ul.contain').append('<li title="Delete '+ newstuff + '">'+newstuff+'</li>'); 
        }
    });




    //Remove an Item
    $("ul.contain li").live('click', function(ev) {
        ev.preventDefault();
        $(this).fadeOut(500, function(ev) { 
            $(this).remove(); 
        });
    });

Это HTML-код для соответствия:

<div class="subStep">
    <h3>Section Headline</h3>

    <ul class="contain">
    <span id="error" class="notice"></span>
    </ul>




    <ul class="popular-list">
    <h4>Headline</h4>
    <li><a href="javascript:;">Dummy Text</a></li>

    </ul>
    <p class="create-entry">Add Your Own: <input type="text" name="createnew" value="" id="create-new" title="" /><a href="javascript:;" class="addnew button">Add New</a></p>
    </div>

Answer 1

Имейте в виду, что вы можете использовать "," в своем селекторе, чтобы прикрепить обработчик к нескольким типам элементов, например:

$("a, div.heading, p").click(function() {
    // this click event will fire for all anchors,
    // paragraphs and divs with the class "heading"
});

Answer 2

Вы можете обернуть всю функцию как обобщенную функцию и передать параметр.

Например:

function DoStuff(selector) { //do stuff }

$(".yourClass").click(function(){
     DoStuff(this);
});

Answer 3

Вы можете создать свою собственную функцию (функцию DoSomething () {/ code /}) и включить ее, например:

$("#something").click(DoSomething);

Если вам нужно внести некоторые измененияЯ вижу, что текст меняется) вы можете сделать это:

function DoSomething() {
   $("#div").html(text);
   /* do something else */
}

var text = 'Hey I am a text!';
$("#something").click(DoSomething);