Question

我有以下代码片段要求在2秒内淡出：

<fieldset id="question-2">
   <p>
      <label>Question 2</label>
   </p>
   <p>Make the word "Disappear" disappear after two seconds.</p>
   <p class="target">Disappear</p>
   <p class="output"></p>
</fieldset>

<fieldset id="question-3">
   <p>
      <label>Question 3</label>
   </p>
   <p>Make the word "Fade" fade after two seconds.</p>
   <p class="target">Fade</p>
   <p class="output"></p>
</fieldset>

我用它来淡出目标词：

$("#question-2.target").fadeOut(2000);
$("#question-3.target").fadeOut(2000);

这不起作用。请帮忙!!

Answer 1

我认为你忘记了jQuery选择器中问题ID之后的空格。因此，我认为你应该使用它，而不是你现在拥有的东西：

$("#question-2 .target").fadeOut(2000);
$("#question-3 .target").fadeOut(2000);

Answer 2

1）在创建元素之前，您的代码可能正在执行。将您的脚本包装在

中

$(function(){
    //...put code here...
});

这将确保在已经创建元素之后执行代码。

2）你需要在选择器的id和类部分之间加一个空格，否则它会在同一个元素中搜索具有这个id和class的所有元素。要搜索子元素，请添加一个空格：

<强>更新

如果你想让“消失”这个词在2秒后消失而不像其他词一样消失，你需要设置一个2秒的超时时间，如下所示：

setTimeout(makeDisapper,2000);
$("#question-3 .target").fadeOut(2000);

function makeDisapper(){
    $("#question-2 .target").hide();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<fieldset id="question-2">
    <p>
        <label>Question 2</label>
    </p>
    <p>Make the word "Disappear" disappear after two seconds.</p>
    <p class="target">Disappear</p>
    <p class="output"></p>
</fieldset>
<fieldset id="question-3">
    <p>
        <label>Question 3</label>
    </p>
    <p>Make the word "Fade" fade after two seconds.</p>
    <p class="target">Fade</p>
    <p class="output"></p>
</fieldset>

我使用的javascript代码无效

2 个答案: