Wie verwende ich eine einfache String-Variable mit jquery?

Ich habe diesen Code:Wie verwende ich eine einfache String-Variable mit jquery?

$(function(){ 

    $("div.modal-content3").on("swipeleft", swipeleftHandler); 


    function swipeleftHandler(event){ 
    if ($('.modal-content').css('display') == 'block' && $('.modal-content2').css('display') == 'block') { 

    $("div.modal-content3").css({"zIndex":"3", "transform":"scale(0.8)", "marginTop":"-50px", "animationName":"animleft", "animationDuration":"0.7s"}); 
    $("div.modal-content2").css({"zIndex":"4", "transform":"scale(0.9)", "marginTop":"-25px", "animationName":"none", "animationDuration":"0"}); 
    $("div.modal-content").css({"zIndex":"5", "transform":"scale(1)", "marginTop":"0px"}); 
}

Wie ich die CSS Teil des Codes setzen können:

"zIndex": "3", "Transformation": "Skala (0,8)", "MarginTop": "- 50px", "animationName": "animleft", "animationDuration": "0.7s"

und es in einer Variable setzen, einfügen später in dem jQuery-Code?

ich so etwas wie dies versucht haben, aber ohne Erfolg:

var test = '"zIndex":"3", "transform":"scale(0.8)", "marginTop":"-50px", 
"animationName":"animleft", "animationDuration":"0.7s"'; 

$("div.modal-content3").css({ + test + });

Bin ich JavaScript und jQuery und ist das Mischen, dass der Grund, warum es nicht funktioniert?

Quelle

2016-12-04 Peter

Der Grund vereinfachen würde, ist, dass jQuery 'css()' Methode nicht akzeptiert eine 'Zeichenkette', wenn Sie auf diese Weise mehrere Eigenschaften festlegen möchten, stattdessen aber ein' Objekt' benötigen, das Schlüssel/Wert-Paare enthält, die den CSS-Regeln entsprechen, die Sie ändern möchten. – connexo

Sie repräsentieren ein Objekt als String. Sie statt

var test = {"zIndex":"3", "transform":"scale(0.8)", "marginTop":"-50px", "animationName":"animleft", "animationDuration":"0.7s"};

tun sollten oder könnten Sie die JSON analysieren Sie

var test = JSON.parse('"zIndex":"3", "transform":"scale(0.8)", "marginTop":"-50px", "animationName":"animleft", "animationDuration":"0.7s"');

Wie für Ihre nächste Zeile haben, Sie sind verwirrend { und } für Streicher. Wenn Sie die obigen Variablendefinitionen verwenden und die { + und + } entfernen, sollte es funktionieren.

Quelle

2016-12-04 00:07:43 Max

Danke, ich benutze die Top-Version und es funktioniert super. Wie würde ich tun, wenn ich zwei verschiedene Variablen im Jquery-Code nacheinander verwenden möchte? Ich versuche $ ("div.modal-content3"). Css (test + test2); aber es scheint nicht zu funktionieren. – Peter

@Peter könnten Sie die Werte von 'test' und' test2' teilen, so dass ich den richtigen Code geben kann? – Max

var test = {"zIndex": "3", "umwandeln": "scale (0.8)", "marginTop": "- 50px"}; var test2 = {"animationName": "animleft", "animationDuration": "0.7s"}; $ ("div.modal-content3").CSS (Test + Test2); Ich versuche nur, eine Reihe von CSS-Text in das Div-modal-content3 einzufügen, aber die CSS-Werte sollten von zwei verschiedenen Variablen wenn möglich, Test und test2 – Peter

Der Grund dafür ist, dass die jQuery .css() Methode kein string akzeptiert, wenn Sie mehrere Eigenschaften festlegen möchten, sondern erfordert ein object Schlüssel-Wert-Paare enthält, die die CSS-Regeln, die Sie ändern möchten, passen.

var test = { "zIndex":"3", "transform":"scale(0.8)", "marginTop":"-50px", "animationName":"animleft", "animationDuration":"0.7s" }; 

$("div.modal-content3").css(test);

Auch wenn das funktioniert, fühlt es sich an, als würden Sie hier alles überkomplizieren.

Warum Sie nicht einfach die folgende CSS-Klasse erstellen:

.my-class { 
    z-index: 3; 
    transform: scale(0.8); 
    margin-top: -50px; 
    animation-name: animleft; 
    animation-duration: 0.7s 
}

die Ihre jQuery

$("div.modal-content3").addClass("my-class");

Quelle

2016-12-04 00:10:18 connexo

Wie verwende ich eine einfache String-Variable mit jquery?

Antwort

Verwandte Themen