JavaScript Wie per JavaScript auf den Value-Wert zugreifen?

[yoyo2435x]

Moinsen,

ich bastle gerade wieder ein wenig mit HTML und JS herum, habe dazu aber eine kleine Frage.

Mein HTML-Code:

<div class="dropdown">
    <button style="background-color: white; border: none;" class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        <input id="xxx" type="text" class="bull" value="<?= $alter_wert ?>">
    </button>
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        <li id="V1" value="Data#1" onclick="changeValue(this)"><a href="#">Datei#1</a></li>
        <li id="V2" value="Data#2" onclick="changeValue(this)"><a href="#">Datei#2</a></li>
        <li id="V3" value="Data#3" onclick="changeValue(this)"><a href="#">Datei#3</a></li>
        <li id="V4" value="Data#4" onclick="changeValue(this)"><a href="#">Datei#4</a></li>
    </ul>
</div>

Wie kann ich da per JS jetzt am besten auf den Value-Wert zugreifen. Bspw. auf V2, wenn ich Datei#2 anklicke?

Grüße,

 

[tollertyp]

Evtl hilft dir das ein wenig: https://www.sitepoint.com/javascript-this-event-handlers/

also du meinst innerhalb der Funktion changeValue nehme ich an?
Du musst dich halt von this zum Eltern-Element "hangeln".

 

[Bitopium]

Geht in der changeValue function nicht: event.srcElement.id?

Oder this.id als parameter übergeben...

 

[Eldok]

Was hast du denn bis jetzt versucht und nach welchen Schlagwörtern hast du gegoogelt? Ein bisschen Eigeninitiative sollte man schon an den Tag legen, sonst wird man sich nie verbessern und das fängt schon beim googeln/suchen an.

http://jsfiddle.net/h1Lc04yt/2/

Gibt zig Möglichkeiten das zu lösen.

 

[tollertyp]

@Bitopium: Stimmt, das OnClick ist ja im li selbst, aber dann noch ein Link da drin, sehr professionell :-)

 

[Hammerhead]

HTML erlaubt an dieser Stelle gar kein value Attribut. Value ist nur für Formularelemente.
In einem <select> Element würde es also funktionieren, aber im <li> wird es von Javascript ignoriert.

Zur Lösung gibt es das data Attribut (statt value)

<li id="V1" data-value="Data#1" onclick="changeValue(this)"><a href="#">Datei#1</a></li>

function changeValue(node) {
    console.log(node.dataset.value);
}