简体   繁体   English

jQuery .attr(“ alt”)=='名称'

[英]jquery .attr(“alt”)=='name'

Can anybody help me letting me know what is wrong with the following code? 有人可以帮我让我知道以下代码有什么问题吗?

$(document).ready(function(){
    $("img").attr("alt")=='minimize'.click(function(){
      alert("he");
     });
});

thanks. 谢谢。

Addition : Sorry guys, I am trying to add an event to a image inside of a table, so when its clicked it collapse the div under need. 另外 :对不起,我正在尝试向表中的图像添加事件,因此单击它时会在需要时折叠div。

I am facing several problems here. 我在这里面临几个问题。

1.- all tables and div use the same class. 1.-所有表和div使用相同的类。 2.- it may be a minimum of two tables and divs. 2.-它可能至少是两个表和div。 3.- first table should no be click able, only its images (for show and hide div under) 4.- rest of tables should be click able the whole table to show and hide div under with slidetoggle. 3.-第一个表不应单击,只能显示其图像(用于显示和隐藏div)4.-其余表应单击整个表以单击并显示和隐藏div。 5.- rest of tables also have two images for show with slideDown and slideUp. 5.-其余表也有两个图像,可通过slideDown和slideUp显示。

What I have it works but not fully. 我所拥有的有效,但无法完全发挥作用。

Once again. 再来一次。

Thanks. 谢谢。

so far this is what I have. 到目前为止,这就是我所拥有的。

<script type="text/javascript">
 $(document).ready(function(){

   $(".heading:not(#Container1)").click(function(){
   var c = $(this).next(".container");
   c.slideToggle("slow");
   });


   });

   $(document).ready(function(){
   $("img[alt='min']").click(function(){
   var c = $(this).next(".container");
   c.slideToggle("slow");

   });

   $("img[alt='max']").click(function(){
   var c = $(this).next(".container");
   c.slideToggle("slow");

   });
   });
</script>

<html>
  <head></head>
  <body>
    <table class="heading" id="container1">
      <tr>
        <td>heading1</td>
        <td><img alt='min'/><img alt='max'/></td>
     </tr>
   </table>
   <div class='container'>Container1</div>
   <table class="heading">
     <tr>
       <td>heading2</td>
       <td><img alt='min'/><img alt='max'/></td>
      </tr>
   </table>
   <div class='container'>Container2</div>
   <table class="heading">
     <tr>
       <td>heading3</td>
       <td><img alt='min'/><img alt='max'/></td>
     </tr>
   </table>
   <div class='container'>Container3</div>
 </body>
</html>

You need to use the attribute selector not get the attribute and compare it. 您需要使用属性选择器而不获取属性并进行比较。

$(document).ready(function(){ 
    $("img[alt='minimize']").click(function(){ 
      alert("he"); 
     }); 
});
$(document).ready(function(){
    $("img[alt='minimize']").click(function(){
        alert("he");
    });
});

EDIT 编辑

$(function() {
    $('img[alt='min'], img[alt='max']').click(function() {
        var container = $(this).parent('table').next('div.container');

        if ( $(this).attr('alt') == 'min' )
            container.slideUp('slow');

        if ( $(this).attr('alt') == 'max' )
            container.slideDown('slow');

        return false;
    });

    $('table.heading:not(:first)').click(function() {
        $(this).next('div.container').slideToggle('slow');

        return false;
    });
});

The alt attribute is not a way to filter your images. alt属性不是一种过滤图像的方法。 It is designed to put alternative content for when the image cannot be displayed (not found, unwanted by user, no screen, etc.) 它设计用于在无法显示图像时(找不到,用户不需要,没有屏幕等)放置替代内容。

You should instead use the class attribute to discriminate your images the way you want. 相反,您应该使用class属性以所需的方式区分图像。

Your code then becomes: 您的代码将变为:

HTML 的HTML

<img src="..." class="minimize" alt="A beautiful image">

Javascript Java脚本

$(document).ready(function(){
    $("img.minimize").click(function(){
        alert("he");
    });
});

It is not syntactically correct. 在语法上不正确。 What are you trying to do? 你想做什么? Maybe this? 也许这个吗?

$(document).ready(function(){
  $("img[alt=minimize]").click(function(){
    alert("he");
   });
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM