Question

HTML：

<script src="/javascripts/controls.js?1366924407" type="text/javascript"></script>
<script src="/javascripts/dragdrop.js?1366924407" type="text/javascript"></script>
<script src="/javascripts/effects.js?1366924407" type="text/javascript"></script>
<script src="/javascripts/jquery-1.7.1.min.js?1366924407" type="text/javascript"></script>
<script src="/javascripts/prototype.js?1366924407" type="text/javascript"></script>
<script src="/javascripts/rails.js?1366924407" type="text/javascript"></script>
<script src="/javascripts/application.js?1366924407" type="text/javascript"></script>
<div id="new_recipe_forms">
    <!--form stuff-->
</div>
<a href="#" onclick="$('#new_recipe_forms').toggle()">New recipe</a>

我有几个问题。

首先，$('#new_recipe_forms')返回null而不是上面的div。

其次，$('new_recipe_forms')返回正确的div，但不响应控制台中的.css("display")。错误是TypeError: Object #<HTMLDivElement> has no method 'css'。

Answer 1

由于你同时包含jQuery和PrototypeJS，你需要jQuery的.noConflict（）

阅读本文：http://api.jquery.com/jQuery.noConflict/ 这个：http://api.prototypejs.org/dom/dollar/

两个图书馆的美元符号的工作方式不同。以下是来自jQuery的网站：

<script type="text/javascript" src="other_lib.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code that uses jQuery's $ can follow here.
  });
  // Code that uses other library's $ can follow here.
</script>

或者，对于您的情况，当您打算使用jQuery的jQuery版本时，另一种方法是始终使用$而不是$。

如果我没有其他选项并且必须包含两个库，我会这样做。它可以节省你自己的理智。

<a href="#" onclick="jQuery('#new_recipe_forms').toggle()">New recipe</a>

jQuery不会按id找到元素，也不会识别jQuery对象

1 个答案: