Czy nie można używać elementów HTML w atrybucie title?

Powyższy screengrab pochodzi z przeglądarki Firefox. Kursor przesuwa się nad żółtym punktem po lewej stronie obrazu. Jest to element <img> (właściwie to jest to obraz wraz z mapą obrazów zawierającą pojedynczy okrągły element <area>, ale zakładam, że to rozróżnienie jest nieistotne), który został utworzony i napisany w JavaScript, w tym zastosowanie atrybutu title (skonstruowanego przez struny do cięcia i klejenia). Jak mogę to zachować i pokazać zamierzoną postać, zamiast niej, zamiast –? Działa dla innerHTML (tekst "Barrow-In-Furness" w górnym środku po lewej stronie to div, który został również utworzony za pomocą JavaScriptu i jego zestawu innerHTML).

Edytuj: W odpowiedzi na pytanie Domenica: tutaj jest to funkcja JavaScript, który tworzy i stosuje atrybut tytułowy (oprócz wykonywania innych zadań):

var StyleLinkMarker = function (LinkNumber, EltA, EltI) { 
    var AltText = LocationName[LinkStart[LinkNumber]] + 
        " to " + 
        LocationName[LinkEnd[LinkNumber]]; 
    if (!EltA) { 
     EltA = document.getElementById("link_marker_area" + LinkNumber); 
     EltI = document.getElementById("link_marker_img" + LinkNumber); 
    } 
    if (LinkStatus[LinkNumber] === 9) { 
     var CanBuyLinkCode = BoardPreviewMode ? 0 : CanBuyLink(LinkNumber); 
     if (CanBuyLinkCode === 0) { 
      EltI.src = ImagePath + "icon-buylink-yes.png"; 
      AltText += " (you can buy this " + LinkAltTextDescription + ")"; 
     } else { 
      EltI.src = ImagePath + "icon-buylink-no.png"; 
      AltText += " (you cannot buy this " + LinkAltTextDescription; 
      AltText += CanBuyLinkCode === 1 ? 
         ", because you aren't connected to it)" : 
         ", because you would have to buy coal from the Demand Track, and you can't afford to do that)"; 
     } 
    } else if (LinkStatus[LinkNumber] === 8 || 
       (LinkStatus[LinkNumber] >= 0 && LinkStatus[LinkNumber] <= 4) 
       ) { 
     EltI.src = ImagePath + "i" + LinkStatus[LinkNumber] + ".png"; 
     if (LinkStatus[LinkNumber] === 8) { 
      AltText += " (orphan " + LinkAltTextDescription + ")"; 
     } else { 
      AltText += " (" + 
         LinkAltTextDescription + 
         " owned by " + 
         PersonReference(LinkStatus[LinkNumber]) + 
         ")"; 
     } 
    } else { 
     throw "Unexpected Link Status"; 
    } 
    EltA.alt = AltText; 
    EltA.title = AltText; 
};

LocationName się następująco:

var LocationName = [ 
    "Barrow&ndash;In&ndash;Furness", "Birkenhead",    "Blackburn", "Blackpool", 
          "Bolton", "Burnley",      "Bury",  "Colne", 
        "Ellesmere Port", "Fleetwood",    "Lancaster", "Liverpool", 
        "Macclesfield", "Manchester",    "The Midlands", "Northwich", 
          "Oldham", "Preston",     "Rochdale", "Scotland", 
         "Southport", "Stockport", "Warrington &amp; Runcorn",  "Wigan", 
         "Yorkshire" 
];

Źródło

2011-05-04 Hammerite

Czy jesteś pewien, że '–' nie jest kodowana dwukrotnie jak : '& ndash;' – Mark

W jaki sposób ustawiasz atrybut title? Następujące działa dobrze: ' sprawdź mnie' – Domenic

@ Mark: Jestem przekonany, że nie jest on podwójnie zakodowany. W szczególności, jeśli byłby on podwójnie zakodowany, powinienem oczekiwać odważnego tekstu Verdany w górnej środkowej lewej części obrazu, aby wyświetlał jednostkę HTML dosłownie, zamiast wyświetlać poprawnie zamierzoną postać. Dzieje się tak dlatego, że zawartość div jest tworzona z tego samego ciągu JavaScript. – Hammerite

nie ustawiania tytuł atrybut, ty jesteś ustawienie tytułu właściwość, która oczekuje tekstu, a nie HTML (chociaż metoda setAttribute oczekuje również ciągu tekstowego).

Mówiąc ogólnie o manipulowaniu DOM, podajesz tekst, a nie HTML. .innerHTML jest godnym uwagi wyjątkiem od tej reguły.

Źródło

2011-05-04 22:14:29 Quentin

Rozumiem. Jak mogę ustawić atrybut title? – Hammerite

Usuwając całą zawartość elementu nadrzędnego i zastępując go za pomocą innerHTML. To nie jest dobry pomysł. Pobierz dane w formacie tekstowym zamiast w formacie HTML. (Możesz, chociaż nie poleciłbym tego jako podejścia, ustaw 'innerHTML' na' span', a następnie odczytaj 'dane' z' textNode', który będzie "firstChild" tego elementu ... ale to lepiej jest uzyskać dane bez kodowania HTML ze źródła) – Quentin

Udało mi się sprawić, by działał przy użyciu tekstu UTF-8 zamiast HTML. Spodziewałem się, że dosłowny znak ampersand w jednym z pozostałych elementów LocationName spowoduje, że strona nie potwierdzi się, ale wydaje się, że niektóre magiczne rzeczy zmieniają ją w byt. Czy nie ma sposobu na konwersję tekstu na i z elementów HTML w JavaScript? Wydaje się zaskakujące, że tak powinno być. – Hammerite

Oto prosty sposób przekonwertować z HTML do tekstu:

function convertHtmlToText(value) { 
    var d = document.createElement('div'); 
    d.innerHTML = value; 
    return d.innerText; 
}

Twój kod może następnie zostać zaktualizowany do tego:

EltA.title = convertHtmlToText(AltText);

Źródło

2013-04-03 00:17:46

To niezwykle praktyczne rozwiązanie, dziękuję!Szkoda, że nie ma na to sposobu, ale jest coś eleganckiego w tej metodzie. –

Czy nie można używać elementów HTML w atrybucie title?

Odpowiedz

Powiązane problemy