得到這個錨標題文本jQuery

Question

我正在嘗試在children div的內部獲取所有錨標題文本

我的HTML

<div onClick="openList();">
  <div class="inc">
    <div class="iWrap">
        <a title="<div>blah1 blah1</div>"></a>
        <a title="<div>blah2 blah2</div>"></a>
        <a title="<div>blah3 blah3</div>"></a>
        <a title="<div>blah4 blah4</div>"></a>
    </div>
  </div>
</div>

<div onClick="openList();">
  <div class="inc">
    <div class="iWrap">
        <a title="<div>some text 1</div>"></a>
        <a title="<div>some text 2</div>"></a>
        <a title="<div>some text 3</div>"></a>
        <a title="<div>some text 4</div>"></a>
    </div>
  </div>
</div>

我的jQuery代碼

function openList()
{
    var getTitletxt = $(this).find('a').attr("title");
    console.log(getTitletxt);
}

我在console.log中變得undefined 。 基本上我正在嘗試在title div中獲取文本。

Answer 1

使用this傳遞當前對象，默認情況下，在綁定處理程序使用javascript內聯處理程序時，此功能不可用。 您的標題也無效，您可能需要使用div中未包含的文本。

現場演示

<div onClick="openList(this);">

function openList(obj)
{
    var getTitletxt = $(obj).find('a').attr("title");
    console.log(getTitletxt );
}

更改

<a title="<div>some text 1</div>"</a>

至

<a title="some text 1"> anchor 1 </a>

對於自定義工具提示類，您可以創建CSS類，我從此處的答案中獲取了它。

帶有工具提示自定義樣式的實時演示

a.ac[title]:hover:after 
{
}

Answer 2

不要使用內聯事件處理程序。 您可以將on用於綁定事件。

HTML ：

<div class="myClass">
<!--       ^^^^^^^^^ -->
    <div class="inc">
        <div class="iWrap"> <a title="<div>blah1 blah1</div>">a</a>
            <a title="<div>blah2 blah2</div>">b</a>
            <a title="<div>blah3 blah3</div>">c</a>
            <a title="<div>blah4 blah4</div>">d</a>
        </div>
    </div>
</div>

<div class="myClass">
<!--     ^^^^^^^^^ -->
    <div class="inc">
        <div class="iWrap"> <a title="<div>some text 1</div>">aa</a>
            <a title="<div>some text 2</div>">bb</a>
            <a title="<div>some text 3</div>">cc</a>
            <a title="<div>some text 4</div>">dd</a>
        </div>
    </div>
</div>

Javascript ：

$('.myClass').on('click', 'a', function() {
    alert($(this).attr('title'));
});

演示： http ： //jsfiddle.net/tusharj/zfboe9o1/

Answer 3

首先關閉您的標簽。

<a title="<div>some text 1</div>"> </a>

this作為參數傳遞給函數

  <div onClick="openList(this);">

   function openList($this)   
   {
     $($this).find('a').each(function(){  // To get all <a> tag title
        var getTitletxt = $(this).attr("title");
        console.log(getTitletxt );
     }); 
  }