jQuery獲取觸摸元素類名

-1

如何在使用Iphone/Ipad時獲取觸摸元素類的名稱？jQuery獲取觸摸元素類名

$(document).bind("touchstart", function (e) { 
    var test1 = e.targetTouches[0].attr('class'); 
    var test2 = e.targetTouches[0].hasClass('menu-item') 
    var test3 = $(e).attr('class'); 

    if (test1 != 'class-name') 
     DoSomething(); 

    if (test2 != true) 
     DoSomething(); 

    if (test3 != true) 
     DoSomething(); 
});

這三個測試的沒有人的作品。

這適用於PC：

$(document).click(function (event) { 
    var test = $(event.target).attr('class'); 

    if (test != 'class-name') 
     $('.collapse').collapse('hide'); 
});

更新：

這在屏幕上點擊時關閉導航欄。

if ($(".navbar-collapse").hasClass("in")) 
     $('.collapse').collapse('hide');

如果我更新的代碼：

var test = e.targetTouches[0].target.className; 

    if ($(".navbar-collapse").hasClass("in")) 
     $('.collapse').collapse('hide');

它不再起作用。是var test = e.targetTouches[0].target.className;真的有效表達式嗎？

來源

2014-11-08 Reft

當然'var test = $（event.target）.attr（'class'）;'也適用於你的第一個例子？（或者只是'var test = event.target.className;'） – 2014-11-08 11:06:38

解釋器甚至沒有達到'if'語句。如果你想使用jQuery方法，你應該首先創建一個jQuery對象。 – undefined 2014-11-08 11:08:28

T.J - 不，它不適用於iphones和ipad .. Vohuman - 你能告訴我你的代碼是什麼意思嗎？它適用於所有其他設備，除了iPhone和iPad，所以它不應該是一個問題。 – Reft 2014-11-08 11:17:02

如果您必須使用targetTouches，則需要使用Touch對象的target屬性，該屬性是DOM元素。如果你想使用它的jQuery方法，你必須包裝它。最後，要訪問jQuery沒有明確複製到jQuery事件對象的任何內容，您需要使用jQuery事件對象的originalEvent屬性。

因此，例如（使用jQuery包裝）：

// Using `target` ---------------------------v 
var test = $(e.originalEvent.targetTouches[0].target).attr('class'); 
//  ^ ^-- using `originalEvent`   ^
//   +-- wrapping in jQuery obj --------------+

或只（直接到反射className屬性）：

var test = e.originalEvent.targetTouches[0].target.className;

$(document).on("touchstart", function(e) { 
 
    if (!e.originalEvent.targetTouches) { 
 
    snippet.log(e.type + ": No e.originalEvent.targetTouches"); 
 
    } 
 
    else if (!e.originalEvent.targetTouches[0]) { 
 
    snippet.log(e.type + ": No e.originalEvent.targetTouches[0]"); 
 
    } 
 
    else if (!e.originalEvent.targetTouches[0].target) { 
 
    snippet.log(e.type + ": No e.originalEvent.targetTouches[0].target"); 
 
    } 
 
    else { 
 
    snippet.log(e.type + ": e.originalEvent.targetTouches[0].target.className: " + e.originalEvent.targetTouches[0].target.className); 
 
    } 
 

 
    // Note that as I said in a comment, `e.target.className` works just fine 
 
    // for the main element 
 
    snippet.log(e.type + ": e.target.className: " + e.target.className); 
 
});

div { 
 
    border: 1px solid #aaa; 
 
    background-color: #eee; 
 
    height: 4em; 
 
    font-family: sans-serif; 
 
    text-align: center; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<!-- Temporary snippet object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 
 
<div class="top">top div</div> 
 
<div class="middle">middle div</div> 
 
<div class="bottom">bottom div</div>

不幸的是，堆棧片段在iOS Safari上不起作用，所以這裏是一個JSBin：http://jsbin.com/xuwuno

來源

2014-11-08 11:18:36

jQuery獲取觸摸元素類名

回答

相關問題