大家好,  我最近刚开始学JQuery, 觉得它的事件什么的挺方便的,  但是我现在遇到一个问题, 就是假设我有一列的button, CSS类都一样, 我自定义了一个index属性, 用来区别这些button, 我在JQuery里面该怎么写函数才能用一个函数处理这一列button的click事件呢?  

解决方案 »

  1.   


    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="gb2312" />
    <title></title>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    </head>
    <body>
    <button index="1">1</button>
    <button index="2">2</button>
    <button index="3">3</button>
    <button index="1">1</button>
    <script>
    $('button[index=1]').click(function(){
    alert(123);
    })
    </script>
    </body>
    </html>
      

  2.   


    不太懂..这个函数是能处理所有button的click么?
      

  3.   

    $('button[index=1]').click(function(){
    alert(123);
    })不是所有的,是根据 index的值来 绑定click,
    button[index=1]  就是 给 index 为 1的button 绑定click
      

  4.   

    那不能写一个函数, 在函数体里再判断index么
      

  5.   


    <!DOCTYPE HTML>
    <html>
        <head>
            <meta charset="gb2312" />
            <title></title>    
            <script src="http://code.jquery.com/jquery-latest.js"></script>
        </head>
        <body>
            <button index="1">1</button>
            <button index="2">2</button>
            <button index="3">3</button>
            <button index="1">1</button>
            <script>
                $('button').click(function(){
                    if( $(this).attr('index') == '1' ){
    alert(123)
    }
                })
            </script>
        </body>
    </html>这个意思?
      

  6.   

    恩  可以这样是吧? 
    那我问个具体一点的,  
    <div class="TileItem" index="0">...</div>
    <div class="TileItem" index="1">...</div>
    <div class="TileItem" index="2">...</div>我现在要用一个函数来handle这3个div的mouseover事件,  怎么弄?
      

  7.   

    楼主可以好好学一下 jquery 很简单的http://www.w3school.com.cn/jquery/jquery_ref_events.asp
      

  8.   

    我已经看完了w3school里的,  但是还是不会.  所以才来问的   求讲解一下
      

  9.   

    根本不需要自定义个index属性
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
    $(document).ready( function() {
    $("div.TileItem").mouseover( function() {
    alert($(this).index());
    });
    });
    </script>
    </head><body>
    <div class="TileItem">...</div>
    <div class="TileItem">...</div>
    <div class="TileItem">...</div>
    </body>
    </html>
      

  10.   

    楼主 如果你真把 w3school 里介绍的jquery看完了 ,那么连这个都不会做的话,真应该多看几遍 或者 考虑下换个行业之类的慢慢学 不要着急。参考下吧
    <!DOCTYPE HTML>
    <html>
        <head>
            <meta charset="gb2312" />
            <title></title>    
            <script src="http://code.jquery.com/jquery-latest.js"></script>
        </head>
        <body>
    <div class="TileItem" index="0">...</div>
    <div class="TileItem" index="1">...</div>
    <div class="TileItem" index="2">...</div>
            <script>
                $('div').mouseover(function(){
    $(this).css('border', '1px solid red');
                }).mouseout(function(){
    $(this).css('border', '');
    })
            </script>
        </body>
    </html>
      

  11.   

    1:event.target
    2:$(this).index
    3:$(this).attr("属性名")