0

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。

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

4

1 回答 1

2

由于您同时包含 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而不是$在您打算使用$.

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

<a href="#" onclick="jQuery('#new_recipe_forms').toggle()">New recipe</a>
于 2013-04-26T15:52:01.883 回答