2016-04-11 18 views
1

Ich habe an einem einfachen Objekt mit Methoden gearbeitet, um Daten auf DOM zu setzen und Daten aus dem DOM basierend auf dem Attribut name zu erhalten, wenn ich es versuche Um die Daten auf ein Element zu setzen, erhalte ich keinen Fehler, aber dem Element werden auch keine Daten zugewiesen. Was mache ich falsch?Einem Element basierend auf seinem Namen keinen JSON-Wert zuweisen

var $ = { 
 
    getData: function(CLASS) { 
 
    var a = document.getElementsByClassName(CLASS), 
 
     b = document.getElementsByClassName(CLASS).length, 
 
     c = {}, 
 
     d = 0; 
 
    for (d = 0; d < b; d++) { 
 
     c[a[d].getAttribute('name')] = a[d].getAttribute('value'); 
 
    } 
 
    return c; 
 
    }, 
 
    setData: function(CLASS, DATA) { 
 
    var a = document.getElementsByClassName(CLASS), 
 
     b = document.getElementsByClassName(CLASS).length, 
 
     c = DATA, 
 
     d = 0; 
 
    for (d = 0; d < b; d++) { 
 
     console.log(c[a[d].getAttribute('name')]); 
 
     a[d].value = c[a[d].getAttribute('name')]; 
 
    } 
 
    return c; 
 
    } 
 
}; 
 
var c = { 
 
    "roger0": "derp", 
 
    "roger1": "derp", 
 
    "roger2": "derp", 
 
    "roger3": "derp", 
 
    "roger4": "derp" 
 
}; 
 

 
$.setData('item', c); 
 

 
console.log($.getData('item'));
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Form</title> 
 
</head> 
 

 
<body> 
 
    <div class="item" name="roger0" value="">0</div> 
 
    <div class="item" name="roger1" value="">1</div> 
 
    <div class="item" name="roger2" value="">2</div> 
 
    <div class="item" name="roger3" value="">3</div> 
 
    <div class="item" name="roger4" value="">4</div> 
 
</body> 
 

 
</html>

+0

Nur ein Hinweis: Beschreibende Variablennamen sind beim Debuggen sehr hilfreich. [Dieser Code macht genau dasselbe, aber mit besseren Variablennamen.] (Https://jsfiddle.net/b0ku7gh9/) Ihr tatsächliches Problem ergibt sich daraus, wie Sie den Elementwert erhalten. –

+0

Mögliches Duplikat von [JavaScript Element.value vs Element.getAttribute ("value")] (http://stackoverflow.com/questions/17494432/javascript-element-value-vs-element-getattributevalue) –

Antwort

1

Sie benötigen setData Funktion ändern, indem Sie Ihre aktuelle Funktion der getAttribute Methode zu verwenden. Die folgende Zeile muss verwendet werden, um den Wert festzulegen.

a[d].setAttribute("value",c[a[d].getAttribute('name')]);

Sie weitere Informationen über setAttribute()here finden.

setData: function(CLASS, DATA) { 
     var a = document.getElementsByClassName(CLASS), 
     b = document.getElementsByClassName(CLASS).length, 
     c = DATA, 
     d = 0; 
     for (d = 0; d < b; d++) { 
      console.log(c[a[d].getAttribute('name')]); 
      console.log(a[d]) 
      a[d].setAttribute("value",c[a[d].getAttribute('name')]); 
     } 
     return c; 
} 
+1

Oh, das ist seltsam, Danke, dass du mir +1 hilfst – Kyle

Verwandte Themen