2

我有一个大约 3 项的清单。我想创建一个 jquery 函数，只要单击其中一个列表项就会触发。然后该函数应该能够使用 html 列表项的值或属性来执行某些操作。因此，在下面的代码中，当我单击按钮 2 时，我会收到一个显示值 2 的警报框。

<ul>
 <li class="myclick" id="1">Test Me</li>
 <li class="myclick" id="2">Test Me 2</li>
 <li class="myclick" id="3">Test Me 3</li>


 $.fn.myFunction = (function() {
          alert(this.id);
          });         
 $(function () {
       $(".myclick").click(function(){
                $().myfunction("Test");
      });

我知道这是一个非常基本的问题，但我对 Jquery 非常陌生，并且正在尝试自学。

TIA

4

3 回答 3

1

jsBin 演示

// PLUGIN method
$.fn.myFunction = (function() {
   this.click(function(){
          alert(this.id);
   });
});   

$(function(){  // DOM READY
  
    $(".myclick").myFunction(); // BIND PLUGIN TO .myclick elements

});

PS，如果有一天你害怕看到prototype某处的使用，......现在试试，而不是fn使用prototype：D

比您还可以使用命名函数：

function alertID() {
   alert(this.id);
}   

$(function(){
  
    $(".myclick").click( alertID );

});
于 2013-01-14T03:37:05.927 回答
0

您不必扩展 jQuery 来执行此操作.. 您可以使用任何旧的通用函数：

myFunction = function () { alert(this.id); }
$(".myclick").on('click', myFunction);

这调用myFuntion使用单击的元素作为上下文。

如果你想使用你已经拥有的代码，你只需要使用$(this).myFunction();而不是$().myFunction

于 2013-01-14T03:37:17.483 回答
-1

首先，你不需要为这个小任务扩展 jQuery。

这是你可以做的..

//looping through each li in ul
$('ul li').each(function(){
    //attach click event to li this refers to li here
    $(this).click(function(){
      //to alert ID of this list this refers to li here
     alert($(this).attr('id'));
      // to alert Text or html within li
     alert($(this).html());
    });
});

希望这可以帮助

于 2013-01-14T04:31:04.797 回答