jquery - 为图像添加 ID

Question

我尝试在这个网站上搜索其他问题，但我还没有找到一个遇到与我相同问题的问题:

我试图在每次点击图像时为图像添加一个 ID，这样我就可以对图像应用特定的样式。这是我用来尝试完成此操作的代码:

    <div class="imgThumbnail">

        <img src="" />
        <img src="" />

    </div>

    <script type="text/javascript">

        $(document).ready(function(){

            //hover over thumbnail effect
           $('.imgThumbnail img').hover(
               function() {
                $(this).css({"height":"18vh","width":"18vh"})},

               function() {
                $(this).css({"height":"17vh","width":"17vh"});    
           }); 

            //selected effect
           $('.imgThumbnail img').click(function(){
              (this).attr("id","selected");
           });

        });

尽管我已尽一切努力解决问题，但我仍未在我的代码中找到问题。我已将点击函数中的 .attr() 更改为 .clear() 以测试我是否瞄准了正确的图像，以及点击是否被注册。正如预期的那样，这清除了我单击的图像。然后我将 $(this).attr("id", "selected") 放到我的悬停函数中，并按预期添加了我的“selected”id 的样式。

那么，为什么当我使用点击功能时，id 不能正确地添加到图像中呢？

我是 jQuery 新手。我对浏览这个网站还是个新手，所以如果你能在其他地方找到答案，我将不胜感激重定向。谢谢!

Answer 1

您的代码已完成 99%。您只是忘记了最后一个 this 之前的 $。

这是你的 javascript 应该是这样的:

    $(document).ready(function(){

        //hover over thumbnail effect
       $('.imgThumbnail img').hover(
           function() {
            $(this).css({"height":"18vh","width":"18vh"})},

           function() {
            $(this).css({"height":"17vh","width":"17vh"});    
       }); 

        //selected effect
       $('.imgThumbnail img').click(function(){
          $(this).attr("id","selected");
       });

    });