我如何使用带有 jquery 的简单字符串变量？

Question

我有这个代码：

$(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"});
}

如何放置代码的 css 部分：

"zIndex":"3", "transform":"scale(0.8)", "marginTop":"-50px", "animationName":"animleft", "animationDuration":"0.7s"

并将其放入变量中，稍后插入到 jquery 代码中？

我试过类似的方法但没有成功:

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

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

我混合了 javascript 和 jquery，这就是它不起作用的原因吗？

Answer 1

您将对象表示为字符串。你应该改为

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

或者您可以解析您拥有的JSON

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

至于您的下一行，您混淆了字符串的 { 和 }。如果您使用上面的变量定义，并删除 { + 和 + } 那么它应该可以工作。

Answer 2

原因是 jQuery 的 .css() 方法不接受 string 如果你想设置多个属性，而是需要一个 object 包含键- 匹配您要更改的 CSS 规则的值对。

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

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

尽管这可行，但感觉你把这里的东西复杂化了。

你为什么不简单地创建以下 CSS class:

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

这会将您的 jQuery 简化为

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

我如何使用带有 jquery 的简单字符串变量？

How do i use a simple string variable with jquery?

javascript

css

string

jquery

var