1

如果在使用 jQuery 时遇到问题，我不知道如何解决。简单地说，我得到了以下内容：

var overlay;

if(condition == "test") {
    overlay = $("<div></div>");
}
else if (condition == "test2") {
    console.log("first-log");
    overlay = $("<span></span>");
}

console.log("second-log");
overlay.prependTo("body");

如果条件与“if”匹配，则一切正常，叠加层充满了内容，并将添加到正文中。

当条件与“else if”匹配时，我收到一个错误，即覆盖未定义。

所以我放了一些 console.log() 来看看我的代码在做什么。两个 console.log 操作都被触发，但在我的浏览器控制台中，我首先看到了“第二个日志”，然后是“第一个日志”。

我的代码正在尝试在“if / else if”完成之前添加，即使条件匹配。

我试图寻找答案，但我根本找不到任何东西，所以我希望这里有人可以帮助我。谢谢！

我的代码的jsfiddle

4

4 回答 4

0

您的代码似乎没有任何问题，我只是对其进行了测试，并且可以正常工作！

您的代码经过测试 - http://jsfiddle.net/9Pb7u/

如果所有其他方法都失败了，一个简单的修复方法是将prependToif 语句放入内部 - 还要确保向 div 和 span 添加一些文本或样式，否则在查看源代码之前它们可能不可见。

if(condition == "test") {
    $("<div>TEST</div>").prependTo("body");
} else if (condition == "test2") {
    $("<span>TEST 2</span>").prependTo("body");
}

工作http://jsfiddle.net/9f93d/

于 2013-12-10T09:05:39.403 回答
0

您应该在程序开始时初始化 var 覆盖。

于 2013-12-10T08:56:52.703 回答
0

我主要通过回调或承诺来解决这类问题。使用回调你可以试试这个：

var overlay = $("");

testCondition = function(callback) {

  if(condition == "test") {
    overlay = $("<div></div>");
  }
  else if (condition == "test2") {
    console.log("first-log");
    overlay = $("<span></span>");
  }

  callback(overlay);

}

并像这样调用这个函数：

testCondition(function(callback){
   overlay.prependTo("body");
});

这是一个小提琴

正如您可以在控制台中检查的那样，正确的元素会被添加;)

于 2013-12-10T09:03:24.900 回答
0

问题的关键在于您使用 jsfiddle 代码进行的更新。根据您的 jsfiddle 链接，它似乎具有以下基本结构：

if (resource=="iframe") {
  console.log("resource is iframe");

} else if (resource=="json") {
    $.getJSON("someUrl", function(data) {
        console.log("resource is json");
    });
}

console.log("at the end - one of the above log statements should be hit");

但是，我认为您试图简化的问题是您的处理案例resource=="json"没有受到打击。

这可能是因为对 getJSON 的调用是异步执行的 - if 块内部的函数没有在您期望的时候内联执行，但是稍后，当 getJSON 调用有结果时，以及在外部函数的其余部分完成执行之后

解决此问题的一种方法是使用回调（类似于Igle 的答案）更改结构，以确保您的处理代码直到之后才执行：

function executeAfterIf() {
    console.log("at the end - one of the above log statements should be hit");
}

if (resource=="iframe") {
  console.log("resource is iframe");
  executeAfterIf();

} else if (resource=="json") {
    $.getJSON("someUrl", function(data) {
        console.log("resource is json");
        executeAfterIf();
    });
}

在这个基本重构中，executeAfterIf是在处理 if 块的任何一种情况之后调用的回调函数。

当然，还有其他模式可以处理这类事情。您选择哪一个取决于项目其余部分中的代码。

于 2013-12-10T16:47:43.120 回答