我有一个简单的jquery.hide()函数，它位于所有具有“groups”类的div上。
但由于某种原因它不起作用，我不知道为什么。我使用的是 Rails 3，并将 jquery 放入 application.js 文件中，并将实际文件“edit”放入脚本标记中。两者都不起作用。谁能明白为什么吗？
这是我的 .html.erb 文件
<h1 class="head">Edit information</h1>
<%= form_for(@user) do |f| %>
<%= render 'shared/error_messages', :object => f.object %>
<div class="field">
<%= f.label :username %><br />
<%= f.text_field :username, :disabled => 'disabled' %>
</div>
<div class="field">
<%= f.label :full_name %><br />
<%= f.text_field :full_name%>
</div>
<div class="field">
<%= f.label :email %><br />
<%= f.text_field :email %>
</div>
<%= javascript_include_tag 'application' %>
<div class="groups">
<%= f.label :password %><br />
<%= f.text_field :current_password %>
<%= f.label :password_confirmation %><br />
<%= f.text_field :current_password %>
<%= f.label :current_password %> <i>(we need your current password to confirm your changes)</i><br />
<%= f.password_field :current_password %>
</div>
<% if current_user.has_role? :Admin %>
<div class="field">
<div style="width:150px"><legend >Group</legend>
<table border="1" width="100%">
<tr>
<th></th>
<th></th>
</tr>
<% for role in @roles %>
<tr>
<td><%= role.name %></td>
<td><%= check_box_tag "user[role_ids][]", role.id, @user.roles.include?(role) %></td>
<tr>
<% end %>
</table>
</div>
</div>
<% else %>
<% end %>
<div class="actions">
<%= f.submit "Update" %>
</div>
<% end %>
<%= button_to 'Back', user_path(@user) %>
以及我在 js 文件和 html.erb 文件顶部使用的 jquery
function (){
$('.groups').hide();
};
值得注意的是我尝试过:
$(document).ready (function (){
$('.groups').hide();
});
还有。
application.js 文件像 jquery 一样加载到页面中。 这是一整天的代码，所以我可能会遗漏一些明显的东西。
更新
<!DOCTYPE html>
<html>
<head>
<title>PadOnRails | Edit user</title>
<meta name="csrf-param" content="authenticity_token"/>
<meta name="csrf-token" content="p64cHvc9nuBXOOHeV08Kg9FBsRxgQZlehw2xetHs57c="/>
<!-- Stylesheets -->
<link href="/stylesheets/custom.css?1313743921" media="screen" rel="stylesheet" type="text/css" />
<link href="/stylesheets/blueprint/screen.css?1313067331" media="screen" rel="stylesheet" type="text/css" />
<link href="/stylesheets/blueprint/print.css?1312273016" media="print" rel="stylesheet" type="text/css" />
<link href="/stylesheets/jquery-ui.css?1313072205" media="screen" rel="stylesheet" type="text/css" />
<script src="/javascripts/jquery-1.6.2.min.js?1312273015" type="text/javascript"></script>
<script src="/javascripts/jquery-ui-1.8.14.custom.min.js?1312273015" type="text/javascript"></script>
<script src="/javascripts/jquery_ujs.js?1312273015" type="text/javascript"></script>
<script src="/javascripts/jquery.dataTables.min.js?1312800139" type="text/javascript"></script>
<script src="/javascripts/datatable.js?1313666950" type="text/javascript"></script>
<script src="/javascripts/rails.validations.js?1312877646" type="text/javascript"></script>
<script src="/javascripts/error_messages.js?1313056625" type="text/javascript"></script>
<script src="/javascripts/jquery.dataTables.columnFilter.js?1312807797" type="text/javascript"></script>
<script src="/javascripts/application.js?1313762558" type="text/javascript"></script>
</head>
<body>
<!-- Container for all the content on the page -->
<div class="container header">
<header>
<div id="top-menu">
<div id="account">
<ul>
<li>Logged in as: <b>admin</b> </li>
<li>Current IP: <b>127.0.0.1</b> </li>
<li><a href="/users/6" class="round">My Account</a></li>
<li><a href="/logout" class="round">Sign out</a></li>
</ul>
</div>
<ul>
<li><a href="/" class="round">Home</a></li>
</ul>
</div>
</header>
<div class=" maintitle">
<div class="lefthead">
<a href="/"><img alt="Matflo" src="/images/logo.png?1312273015" /></a>
</div>
<div class="righthead">
PAD
</div>
</div>
</div>
<!-- Get contents from pages -->
<div class="container main">
<!-- Messages Blueprint => :error [red], :success [green], :info [blue] and :notice [yellow] -->
<h1 class="head">Edit information</h1>
<form accept-charset="UTF-8" action="/users/6" class="edit_user" id="edit_user_6" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /><input name="_method" type="hidden" value="put" /><input name="authenticity_token" type="hidden" value="p64cHvc9nuBXOOHeV08Kg9FBsRxgQZlehw2xetHs57c=" /></div>
<div class="field">
<label for="user_username">Username</label><br />
<input disabled="disabled" id="user_username" name="user[username]" size="30" type="text" value="admin" />
</div>
<div class="field">
<label for="user_full_name">Full name</label><br />
<input id="user_full_name" name="user[full_name]" size="30" type="text" value="admin" />
</div>
<div class="field">
<label for="user_email">Email</label><br />
<input id="user_email" name="user[email]" size="30" type="text" value="admin@dai.co.uk" />
</div>
<div class="groups">
<label for="user_password">Password</label><br />
<input id="user_current_password" name="user[current_password]" size="30" type="text" />
<label for="user_password_confirmation">Password confirmation</label><br />
<input id="user_current_password" name="user[current_password]" size="30" type="text" />
<label for="user_current_password">Current password</label> <i>(we need your current password to confirm your changes)</i><br />
<input id="user_current_password" name="user[current_password]" size="30" type="password" />
</div>
<div class="field">
<div style="width:150px"><legend >Group</legend>
<table border="1" width="100%">
<tr>
<th></th>
<th></th>
</tr>
<tr>
<td>Developer</td>
<td><input id="user_role_ids_" name="user[role_ids][]" type="checkbox" value="1" /></td>
<tr>
<tr>
<td>Corporate</td>
<td><input id="user_role_ids_" name="user[role_ids][]" type="checkbox" value="2" /></td>
<tr>
<tr>
<td>ProjectManager</td>
<td><input id="user_role_ids_" name="user[role_ids][]" type="checkbox" value="3" /></td>
<tr>
<tr>
<td>Admin</td>
<td><input checked="checked" id="user_role_ids_" name="user[role_ids][]" type="checkbox" value="4" /></td>
<tr>
<tr>
<td>TeamLeader</td>
<td><input id="user_role_ids_" name="user[role_ids][]" type="checkbox" value="5" /></td>
<tr>
<tr>
<td>Engineer</td>
<td><input id="user_role_ids_" name="user[role_ids][]" type="checkbox" value="6" /></td>
<tr>
</table>
</div>
</div>
<div class="actions">
<input id="user_submit" name="commit" type="submit" value="Update" />
</div>
</form><form method="post" action="/users/6" class="button_to"><div><input type="submit" value="Back" /><input name="authenticity_token" type="hidden" value="p64cHvc9nuBXOOHeV08Kg9FBsRxgQZlehw2xetHs57c=" /></div></form>
</div>
</div>
<!-- Debug information outside page container- REMOVE WHEN FINISHED! -->
</body>
<div class="container">
<div id="bottom-menu">
<pre class='debug_dump'>--- !map:ActiveSupport::HashWithIndifferentAccess
action: edit
id: "6"
controller: users
</pre>
</div>
</div>
</html>
根据要求直接从源中提取 HTML。
最佳答案
确保不包含原型(prototype)，“$”可以被任何库使用。试试这个:
jQuery(document).ready(function(){
jQuery(".groups").hide();
});
额外:如果您用 HTML 元素编写脚本，正确的做法是使用双引号 ("")。
关于javascript - 为什么我的 jquery .hide() 不工作？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7122773/