Fatal编程技术网
  • javascript/
  • Javascript 如何使用jQuery隐藏表行？

Javascript 如何使用jQuery隐藏表行？

javascript jquery

Javascript 如何使用jQuery隐藏表行？,javascript,jquery,hide,Javascript,Jquery,Hide,我试图用jQuery而不是jsas隐藏一个表行。这是我放在标题中的脚本： self.response.out.write(""" <html> <head> <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" /> <title>User Admin Page</title> <script src="ht

我试图用jQuery而不是jsas隐藏一个表行。这是我放在标题中的脚本：

self.response.out.write("""
    <html>
    <head>
    <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" /> 
    <title>User Admin Page</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
    <script>
    $(document).ready(function() {
        $("#false").click(function() {
        $("#hide").hide("slow");
    });
});
</script>
<body>
""")

self.response.out.write（“”）
用户管理页面
$（文档）.ready（函数（）{
$（“#false”）。单击（函数（）{
$（“隐藏”）.hide（“慢”）；
});
});
""")
以下是html：

...
<tr class="hide">
 <td>
  ...
   <a class="false" href="/useradminpage?main_id=%s&display=false"><span class="small">(hide)</span></a>
  </td>
 </tr>
</div>
...

。。。
...
...
这是行不通的。这个问题是，但我不能让我的工作。我做错了什么

更新

根据答案编辑代码。但这仍然不起作用，尽管它在JSFIDLE中起作用：

         <html><head>
         <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" /> 
         <title>User Admin Page</title>
         <script  src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">

<script>


 $(document).ready(function() {

     $("a.false").click(function(e) {
     $(".hide").hide("slow");
     e.preventDefault();
          });

 });   </script> </head>
         <body>
 ...


用户管理页面
$（文档）.ready（函数（）{
$（“a.false”）。单击（函数（e）{
$（“.hide”）.hide（“慢”）；
e、 预防默认值（）；
});
});    
...
更新

CDN呼叫中缺少结束
；但是现在整个桌子都被隐藏了；我将在表格中添加这一部分。再次感谢您的回答：

    self.response.out.write("""<table class="mytable">
    <tr class="head">
    <th  width="80%">links</th><th>edit tags</th>
    </tr>    
    """)        

    query = Main.all()
    query.filter("owner", user)
    query.filter("display", True)
    query.order("-date")
    cursor = self.request.get("cursor")
    if cursor: query.with_cursor(cursor)
    e = query.fetch(100)
    cursor = query.cursor()

    for item in e:
        main_id = item.key().id()
        self.response.out.write("""
        <tr class="hide">
        <td><a href="%s" target="_blank">%s</a><span class=small> (%s) </span><br />
        <span class=small>%s</span>
        <a href="/edit?main_id=%s"><span class="small">(edit)</span></a>
        <a class="false" href="/useradminpage?main_id=%s&display=false"><span class="small">(hide)</span></a>
        <a href="/comment?main_id=%s"><span class="small">(comments)</span></a></td>
        <td><a href="/tc?url=%s&main_id=%s&user_tag_list=%s" title="edit tags">%s</a>
        </td>
        </tr>
        """ % tuple([item.url, item.title, urlparse(item.url).netloc,
        f1.truncate_at_space(item.pitch), main_id, main_id, main_id,
        item.url, main_id, (", ".join(item.tag_list)),
        (", ".join(item.tag_list)),]))


    self.response.out.write("""</tbody></table>""")    

self.response.out.write（“”）
linksedit标签
""")        
query=Main.all（）
query.filter（“所有者”，用户）
query.filter（“显示”，True）
查询订单（“-日期”）
cursor=self.request.get（“cursor”）
if cursor:query.with_cursor（游标）
e=query.fetch（100）
cursor=query.cursor（）
对于e中的项目：
main_id=item.key（）.id（）
self.response.out.write（“”）
（%s）

%
“”%tuple（[item.url，item.title，urlparse（item.url）.netloc，
f1.在_空间（item.pitch）、main_id、main_id、main_id处截断_，
item.url，main_id，（“，”.join（item.tag_list）），
（“，”.join（item.tag_list）），]））
self.response.out.write（“”）
首先，在HTML中有
false
作为
类




编辑

现在它隐藏了整个表

这是因为所有行都是使用相同的
hide
类生成的，如图所示


for item in e:
    main_id = item.key().id()
    self.response.out.write("""
    <tr class="hide">


更新示例：



编辑2

也许最近的
会更好

试试这个

$("a.false").click(function(e){
    $(this).closest('tr.hide').hide();
    e.preventDefault();
});
示例3:

您正在使用ID选择器：

$("#false").click(function() {
    $("#hide").hide("slow");
});

$(".false").click(function() {
    $(".hide").hide("slow");
});
当您需要类选择器时：

$("#false").click(function() {
    $("#hide").hide("slow");
});

$(".false").click(function() {
    $(".hide").hide("slow");
});
演示：

@Jason:谢谢。我一定是在代码的另一部分做错了什么，因为这在GoogleAppEngine中不起作用，尽管它在JSFIDLE中起作用。标题有问题吗？再次感谢。如果删除上面原始HTML中
tr
周围的
div
，会发生什么？这不应该有什么区别。。。但是？您可能还想更新CDN呼叫。而不是
https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
，使用
https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js
@Jason:谢谢，我这么做了，这不是问题所在，但我注意到结尾的
不见了，我补充说现在可以了，但现在它隐藏了整个表。你知道为什么吗？我将用剩下的代码更新这个问题。@Zeynel，我又修改了一次js。请参阅编辑，看看是否有效。@mu太短：不，这是早期版本的内容；我更新了问题。但这仍然不起作用。