TypeError: Object #<HTMLDivElement> 没有方法“fadeTo”答案

【问题标题】：TypeError: Object #<HTMLDivElement> has no method 'fadeTo'TypeError: Object #<HTMLDivElement> 没有方法“fadeTo”
【发布时间】：2014-03-07 13:42:41
【问题描述】：

我正在尝试使用此代码淡化 div：

Javascript：

<script type="text/javascript">

  function show(id) {
    //document.getElementsByName(id)[0].style.visibility = "visible";
    document.getElementsByName(id)[0].fadeTo( "slow", 0.5 );
  }
  function hide(id) {
    document.getElementsByName(id)[0].style.visibility = "hidden";
  }


</script>

html:

<div style="width: 80px; height: 20px; background-color: red;" onmouseover="show('hej')" onmouseout="hide('hej')">
   <div id="div1" Name="hej" class="hej">Text</div>
</div>

我已包含：

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

我收到错误“TypeError: Object # has no method 'fadeTo'”。谁能帮助解决这个问题并解释为什么它不起作用？

【问题讨论】：

$('[name='+id=']').fadeTo("slow", 0.5);

标签： php jquery fadeto

【解决方案1】：

Javascript DOM 元素没有fadeTo 方法，需要用jQuery 包裹起来

$(document.getElementsByName(id)[0])

或者这样做

$('[name="'+id+'"]').eq(0).fadeTo(

【讨论】：

所以 $(document.getElementsByName(id)[0]).fadeTo( "slow", 0.5 ); ?
嗯，它无法正常工作：/ 尝试查看gamestylerz.com/gameshop，然后查看红色框

【解决方案2】：

因为您正在定位一个 DOM 元素并尝试在其上调用 jQuery 方法。您需要选择 DOM 对象并将其放入 jQuery 集合中：

function show(id) {
    $('[name='+id+']').fadeTo("slow", 0.5);
}
function hide(id) {
    $('[name='+id+']').hide()
}

JSFiddle

我假设由于您将名称传递给函数，因此它是唯一的，否则您需要确保仅针对当前上下文中的元素。像这样的东西很适合你：

JSFiddle

【讨论】：

如果有更多同名元素，您需要使用 .eq(0) 来获取所需的元素。
或 $(document.getElementsByName(id)[0]).fadeTo('slow', 0.5); - 那也一样
.get(0) 怎么样。
@Jai 这将返回元素并让我们回到我们开始的地方。
@Anton 是的，除了这行得通，OP 没有指定[name=hej] 是否会有多个匹配项

【解决方案3】：

.fadeTo 是 jquery 对象的方法，document.getElementsByName(id) 不返回 jquery 对象。

你可以试试：

$('[name="'+id+'"]').eq(0).fadeTo( "slow", 0.5 );

【讨论】：

【解决方案4】：

您的 javascript 错误：/ - 您正在尝试将 jquery 函数应用于 javascript 对象。这就是您收到 Object# 错误而不是 JQuery Object 错误的原因。而不是getelementby id，使用JQuery选择器..看看这里：

http://blog.techplusone.com/wp-content/uploads/2012/09/jquery-Api-1.2.png 和book markit，以前对我有很大帮助。

function show(id) {
   $('#' + id).show('slow');
  }
  function hide(id) {
     $('#' + id).hide('slow');
   }

【讨论】：