JavaScript函数只能使用一次。任何想法为什么？

问题描述：

我正在尝试创建一个todolist应用程序。我想让每个任务列表都用渐变过渡来删除。我已经实现了它，但是我的代码的问题是它只隐藏了第一个div区域。

<div id="task"> 
      <input type="checkbox" id="completed"> 
      <h2>Buy some fruits</h2> 
     </div> 
     <div id="task"> 
      <input type="checkbox" id="completed"> 
      <h2>Buy some fruits</h2> 
     </div>

JQuery的

$("#completed").change(function(){$("#item").fadeToggle("fast", "linear")});

你有在网页上使用相同ID不止一个元素

$(".completed").change(function(){ } $(this).hide();});

请修改此代码。 – akonsu 2014-10-08 05:34:58

您应该使用'''class'''而不是''ID'''，因为Id在上下文中应该是唯一的，并且只返回具有相同'''ID''的第一个元素 – kuldipem 2014-10-08 05:37:36

答

不使用mutipple id's在同一页上使用class代替

<div class="task"> 
    <input type="checkbox" class="completed"> 
    <h2>Buy some fruits</h2> 
</div> 
<div class="task"> 
    <input type="checkbox" class="completed"> 
    <h2>Buy some fruits</h2> 
</div> 

$(".completed").change(function(){$("#item").fadeToggle("fast", "linear")}); 

// same apply to your #item

答

你不应该具有相同id多个元素。这个属性的全部要点是唯一标识一个元素。因此

<input type="checkbox" class="completed">

而JavaScript：

喜欢的东西取代它

$(".completed").change(function(){$("#item").fadeToggle("fast", "linear")});

这应该整理你的问题了。

答

试试这个：

<div> 
    <input type="checkbox" class="checkbox"> 
    <h2>Buy some fruits</h2> 
</div> 
<div> 
    <input type="checkbox" class="checkbox"> 
    <h2>Buy some fruits</h2> 
</div> 
<script type="text/javascript"> 
    $(".checkbox").change(function(){$(this).parent().fadeToggle("fast", "linear")}); 
</script>

<div> 
    <input type="checkbox"> 
    <h2>Buy some fruits</h2> 
</div> 
<div> 
    <input type="checkbox"> 
    <h2>Buy some fruits</h2> 
</div> 
<script type="text/javascript"> 
    $("input[type=checkbox]").change(function(){$(this).parent().fadeToggle("fast", "linear")}); 
</script>

答

id两个输入元素相同。

您可以使用班级而不是id。

像下面为每U [R

JavaScript函数只能使用一次。任何想法为什么？

相关推荐