関数jqueryを再利用しますか？

Question

私はこの機能を使って、同じページの他の3つのセクションに対して同じ機能を使いたいと思います。

私は「これ」を近づけようとしましたが、正しく動作しません。何かご意見は？

私は「含む」というクラスのULを持っています。私はまた、「サブセット」という独自のdivに各セクションをラップしていますので、「親」になります。

//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

あなたは、一般的な機能として、全体の機能をラップして、パラメータを渡すことができるかもしれません。例えば

：

function DoStuff(selector) { //do stuff } 

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

Answer 2

により、たとえば、要素の複数のタイプにハンドラをアタッチするために、あなたのセレクタに「」を使用することができますに注意してください：

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

Answer 3

をあなたはあなたを作ることができます例えば自身の機能（関数のdoSomething（）{/ コード /}）とを含む、：

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

あなたはこれを行うことができます（私はテキストが変更することを参照）、いくつかの変更をする必要がある場合：このメソッドは、素晴らしい作品

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

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