【问题标题】:Jquery Mobile - swipe left get row idJquery Mobile - 向左滑动获取行 ID
【发布时间】:2017-10-26 08:57:32
【问题描述】:

我正在使用 Query mobile 向左滑动,这很有效,并弹出一个警告窗口,提示您已滑动。但我在警报中没有 id。

    $(function(){
    // Bind the swipeleftHandler callback function to the swipe event on div.box
    $(".row").on( "swipeleft", swipeleftHandler );
    // Callback function references the event target and adds the 'swipeleft' class to it
    function swipeleftHandler( e ){
        $id =  e.target.id;
        alert( 'You swiped ' + $id  );
    }
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.4.5/jquery.mobile.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.4.5/jquery.mobile.min.css" rel="stylesheet"/>

<table class="alert-table" cellspacing="0" cellpadding="0">         
    <tr>
        <th>Date/Time</th>               
        <th>Alert</th>
        <th>Acknowledged By</th>
        <th>&nbsp;</th>
    </tr>   
    <tr id="12345" class="row {% cycle 'tr-1' 'tr-2' %}">
        <td>01/01/2017 3:41</td>
        <td>
            Device: Server <br/>
            Component: CPU <br />             
            Alert: 100%
        </td>
        <td>Bill Jones</td>
        <td></td>

    </tr>
    <tr id="12346" class="row {% cycle 'tr-1' 'tr-2' %}">
        <td>01/01/2017 4:41</td>
        <td>
            Device: Switch 02<br/>
            Component: Port 10 <br />             
            Alert: Down
        </td>
        <td>Fred Smith</td>
        <td></td>

    </tr>
</table>

【问题讨论】:

标签: jquery jquery-mobile


【解决方案1】:

尝试$id = $(this).attr('id'); 而不是$id = e.target.id;。 它应该工作

【讨论】:

  • 只是想快速解释一下它起作用的原因。这里的事件目标不是.row,而是行内的td标签。这是有效的,因为不是尝试获取 td 的 id(它没有 id),而是从 .row 获取它。 td 是被滑动的 DOM 元素,但 $(this) 是侦听器附加到的 DOM 元素。你可以在这里阅读更多信息:stackoverflow.com/a/21667010/6624953
猜你喜欢
  • 2023-03-10
  • 1970-01-01
  • 1970-01-01
  • 2013-10-27
  • 2011-08-25
  • 2014-02-13
  • 1970-01-01
  • 1970-01-01
  • 2013-05-11
相关资源
最近更新 更多