Question

我有这个功能，我想在同一页面上为其他3个部分使用相同的功能。

我试过把“这个”和最近的但是它无法正常工作。有什么想法吗？

我有一个带有“包含”类的UL我还将每个部分包装到它自己的“subSet”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

请记住，您可以在选择器中使用“，”将处理程序附加到多种类型的元素，例如：

$("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（）{/ 代码 /}）并包含它，例如：

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

如果您需要进行一些更改（我看到文本发生了变化），您可以执行此操作：

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

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

重用函数jquery？

3 个答案: