0

我正在构建的婚礼 RSVP 网站有以下 HTML：

<!doctype html>
<html>
    <head>
        <title>Amy and Scott's Wedding - RSVP Page</title>
        <link href="http://www.asjwedding.com/style/base.css" rel="stylesheet">
        <link href="http://www.asjwedding.com/style/user.css" rel="stylesheet">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://www.asjwedding.com/script/formControl.js"></script>

    </head>
    <body>
        <div id="doc">
            <div id="content">
                <div class="text-content">
                    <h1>Welcome!</h1>
                    <div class="question">
                        ... omitted for brevity ...
                                        <div id="messageArea" class="response">
                                        </div>
                                        <div class="submitButton">
                      <input type="submit" value="Submit" onclick="validateForm();">
                      </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

而且，我有以下使用 jQuery 的 javascript：

function hideMessage() {
  alert("Fading...");
  $("#messageArea").fadeOut();
}

但是，由于某种原因，褪色不起作用，我不确定为什么。如果我在 hideMessage() 中执行 hide()，它可以正常工作，但如果我使用 fadeOut()，则什么也不会发生。（实际上，这不是真的......它确实给了我警报，但它实际上并没有褪色）。

我在 Linux 上使用 Firefox Nightly (14.0)，但 Android 上的 Firefox Nightly确实有效……我不完全确定为什么它不能在桌面上运行。

有人可以帮助我吗？

编辑：

我拥有的其他 javascript 函数的一些代码：

function validateForm() {
  // Verify at least one of the rsvp options is selected.
  if (!$("#radNone").attr("checked") &&
      !$("#radWedding").attr("checked") &&
      !$("#radReception").attr("checked") &&
      !$("#radBoth").attr("checked")) {
     sendMessage("Please choose one of the RSVP options.");
        return;
  }
}

function hideMessage() {
  alert("Fading...");
  $("#messageArea").fadeOut();
}

function sendNegativeMessage(message) {
  $("#messageArea").css('background-color', '#FF6666');
  $("#messageArea").html(message);
  $("#messageArea").show();
}

function sendMessage(message, type) {
  setTimeout(hideMessage, 1000);

  $('#messageArea').css('opacity', '1.0');
  // Type can be 'positive', 'negative.
  if (!type) {
    // Assume it's negative.
    sendNegativeMessage(message);
  }
}
4

2 回答 2

1

您需要确保在加载 DOM 后调用它（否则警报将正确触发，但 DOM 元素将不存在，当您尝试操作它时会导致问题）。尝试这个：

function hideMessage() {
    alert("Fading...");
        $("#messageArea").fadeOut();
    }

$(function() {
    hideMessage();
});
于 2012-04-16T02:44:20.890 回答
0

嗯......奇怪，但现在它似乎工作得很好。我实际上并没有改变任何东西（我知道人们会这么说，但在这种情况下，甚至文件的时间戳都是在我问这个问题之前）。

我一定是在看旧版本的网站……或者什么……

于 2012-04-16T05:41:13.273 回答