Question

我正在尝试使用两个变量工作的jquery函数。相当新的，所以请耐心等待:)。

变量one从头开始定义，可以通过单击特定按钮（.btn - effect2或.btn - effect3）进行更改。当单击类.trigger的按钮时，变量2将html插入到DOM中。

以下是我提出的jquery。

到目前为止工作的是什么：至于console.log告诉我，当.btn - effect2（或3）被点击时，变量1会更新。

什么不起作用不幸的是，更新似乎不会对插入的html（变量2）中的变量生效。

一个有趣的Q＆amp; A我找到了Updating a global variable from a function。我尝试修改我的代码，因为我觉得关于范围是关闭的。但我想，我不太明白该怎么做，因为它没有按预期工作。

如果我错过了任何完全不同的解决方案，请指出给我。非常感谢任何帮助。

非常感谢！

＆＃13;

var one = "effect1";

$('.btn--effect2').click(function(){
	window.one = "effect2";
    console.log(one);
});

$('.btn--effect3').click(function(){
	window.one = "effect3";
    console.log(one);
});

var two = "<li><div class='post post--"+one+"'><p>Some text.</p></div></li>"

$('.trigger').click(function(){
  $('.list ul li:eq(0)').before(two);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn--effect1">effect1</button>
<button class="btn--effect2">effect2</button>
<button class="btn--effect3">effect3</button>
<button class="trigger">trigger</button>

<section class="list">
  <ul>
    <li><div class="post post--effect1"><p>Some text.</p></div></li>
  </ul>
  <ul>
    <li><div class="post post--effect1"><p>Some text.</p></div></li>
  </ul>
  <ul>
    <li><div class="post post--effect1"><p>Some text.</p></div></li>
  </ul>
</section>

＆＃13;

Answer 1

原因是：在您的代码中，two在开始时定义，永远不会更改！

这不是那么有活力。

var one = "effect1";

$('.btn--effect2').click(function(){
	window.one = "effect2";
    console.log(one);
});

$('.btn--effect3').click(function(){
	window.one = "effect3";
    console.log(one);
});

$('.trigger').click(function(){
  var two = "<li><div class='post post--"+one+"'><p>Some text.</p></div></li>"
  $('.list ul li:eq(0)').before(two);
});

这应该有用。

jquery问题，两个变量相互依赖

1 个答案: