0
UPDATE: Haben Sie den Titel richtig zu ziehen, aber in Internet Explorer wird der Titel des Bildes nicht angezeigt. Funktioniert in Firefox und Chrome. Ich kann meinen Kopf nicht drum herum kommen, wir sprechen darüber:Legen Sie ein HTML-Attribut img Titel mit Javascript
<script type="text/javascript" src="//www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<html>
<i><strong><a href="__URL__" target="_blank">PDW Status: </a></strong></i>
<a href="__URL__" target="_blank"></a>
<a href="__URL__" target="_blank"><br/></a>
<a href="__URL__" target="_blank">Green</a> -
<img id="Green" class="ms-rtePosition-4 ms-rteImage-2 ms-rteStyle-Emphasis" alt="lightgreen1.jpg"
src="__URL__" style="margin: 5px;"/></em>     
<a href="__URL__" target="_blank">Red</a> -
<img id="Red" class="ms-rtePosition-4 ms-rteImage-2 ms-rteStyle-Emphasis" alt="red1.jpg"
src="__URL__" style="margin: 5px;"/></em>     
<a href="__URL__" target="_blank">Yellow</a> -
<img id="Yellow" class="ms-rtePosition-4 ms-rteImage-2 ms-rteStyle-Emphasis" alt="yellow1.jpg"
src="__URL__" style="margin: 5px;"/>     
<a href="__URL__" target="_blank">White</a>  -
<img id="White" class="ms-rteImage-2 ms-rtePosition-4" alt="white.jpg"
src="__URL__" style="margin: 5px;"/> 
</html>
<style>
a:link { text-decoration: none;
color: #0072c6 } a:visited { text-decoration: none; color: #0072c6 } a:hover { text-decoration: underline; } a:active { text-decoration: underline; }
</style>
<script type="text/javascript">
//Grab data from list and post into HTML Fields
$(function() {
green = "";
yellow = "";
red = "";
white = "";
$.ajax({
url: "__URL__",
headers: {"Accept": "application/json;odata=verbose"},
type: "GET",
cache: false,
async: false,
}).success(function (data) {
$.each(data.d.results, function(key, value) {
console.log(value.Title);
switch (value.Title) {
case "GREEN":
green += value.Description;
console.log("GREEN TEST" + green);
var gDescription = document.querySelector('#Green');
gDescription.title = "" + green;
break;
case "YELLOW":
yellow += value.Description;
console.log("YELLOW TEST" + yellow);
var yDescription = document.querySelector('#Yellow');
yDescription.title = "" + yellow;
break;
case "RED":
red += value.Description;
console.log("RED TEST" + red);
var rDescription = document.querySelector('#Red');
rDescription.title = "" + red;
break;
default:
white += value.Description;
console.log("WHITE TEST" + white);
var wDescription = document.querySelector('#White');
wDescription.title = "" + white;
}
});
});
});
</script>
Dies ist eine weitere Frage, aber das schien nicht, es zu beheben entweder: why can't I set an ascii reference in an img title attribute using js?
Sie Schleife durch jedes der Elemente ein HTML-Bild Titel-Attribut gesetzt könnte. Erhalten Sie einen Fehler auf der Konsole? Bei welchem Objekt wird es nicht an die grüne Variable angehängt? Ich würde die grüne Variable in Ihrem Konsolenprotokoll auch nach value.Title und value.Description setzen. Sehen Sie, was eingestellt ist. Ohne die Daten zu sehen, die das Problem verursachen, ist es schwierig, eine Lösung vorzuschlagen. – ManoDestra
Beachten Sie auch, dass jeder Browser das title-Attribut unterschiedlich behandelt. Sie müssen die Daten überprüfen, die von Ihrem AJAX-Anruf zurückkommen. Und geben Sie aus, was für Ihre Variablen in jeder Schleife festgelegt ist. Verwenden Sie Ihre console.log-Anweisungen und Sie werden den Fehler finden. Es gibt kein großes Problem in Ihrem Code an sich, abgesehen von der Abwesenheit von irgendetwas, das Gelb, Rot oder Weiß setzt. Und die Variablen werden weiterhin mit jedem AJAX-Aufruf angefügt, sie werden nie auf "" zurückgesetzt. Das mag gut sein, aber es ist bemerkenswert. – ManoDestra