Question

我想在点击事件中获得标签的位置。对于exameple：

<label class="labelClass" onclick="getPosition()"> label1 </label>//return position 1
<label class="labelClass" onclick="getPosition()"> label2 </label>//return position 2
<label class="labelClass" onclick="getPosition()"> label3 </label>//return position 3 ...etc
<label class="labelClass" onclick="getPosition()"> label4 </label>
<label class="labelClass" onclick="getPosition()"> label5 </label>

function getPosition() {
    //pseudocode to get position
    var label = document.getElementsByClassName("labelClass");
    alert(label.position) //something like this;
}

Answer 1

您必须将HTMLCollection转换为Array，以便您可以从列表中找到该元素的索引。希望这对你有用..

    <label class="labelClass" onclick="getPosition(this)" > label1 </label>//return position 0
    <label class="labelClass" onclick="getPosition(this)" > label2 </label>//return position 1
    <label class="labelClass" onclick="getPosition(this)" > label3 </label>//return position 2 ...etc
    <label class="labelClass" onclick="getPosition(this)"> label4 </label>
    <label class="labelClass" onclick="getPosition(this)"> label5 </label>

    function getPosition(label)
    {
       var list=document.getElementsByClassName("labelClass");
       list = [].slice.call(list); 

       alert(list.indexOf(label));
    }

以下是jsfiddle

Answer 2

试试这个：

将onclick =“getPosition（）”更改为onclick =“getPosition（this）”
：

- 将函数getPosition（）更改为函数getPosition（obj）

- 使用alert(obj.style.position)

Answer 3

这可能会有所帮助

function getPosition()
{
 var p = $(this);
 var position = p.position();
 $( ".result" ).text( "left: " + position.left + ", top: " + position.top );

}

如何从classname onclick获得位置？

3 个答案: