Question

我遇到了JQuery的$ this选择器。这无所事事。然而，脚本的基本核心并没有失败。

$(this).css("background-image", 
"url(http://www.divethegap.com/update/z-images/diving-trips/tabs/bases-z.png)");

任何想法为什么它不起作用？我使用类尝试了相同的效果。

完整代码（根据要求） http://jsfiddle.net/mcxez/1/：

标记：

<a href="?accommodation" style="background-position:-15px top;" 
   onclick="inload('?accommodation'); return false">Accommodation</a>

<a href="?travel" style="background-position:-15px top;" 
   onclick="inload('?travel'); return false">Travel</a>

JS：

function inload(thelink) {
    $('.TABbase').click(function(){
        $(this).css("background-image", 
            "url(http://www.divethegap.com/update/z-images/diving-trips/tabs/bases-z.png)"); 
    });

  return false;
}

Answer 1

在jQuery中，this通常是对函数内部内容的引用..比如......

<强> HTML

<button id="button1">1</button>
<button id="button2">2</button>

<强> JS

$('button').click(function(){
    alert( $(this).attr('id') ); //either 'button1' or 'button2'
}

在这种情况下，this指的是被点击的按钮。

也许你可以分享一些关于你想要完成的事情的代码。

Answer 2

以下是修订后的HTML

<a href="?accommodation" style="background-position:-15px top;" data-href="?accomodation" class="my_class">Accommodation</a>
<a class="my_class" href="?travel" style="background-position:-15px top;" data-href="?travel" >Travel</a>

这是javascript

$(document).ready(function(){
  $(".my_class").click(function(){
    $(this).css("background-image", "url(http://www.divethegap.com/update/z-images/diving-trips/tabs/bases-z.png)");
    return false;
  });
});

Answer 3

你在哪里打电话给this？ this是一个特殊变量，它引用当前在适用于它的方法中引用的对象。如果您从方法外部引用this，则它引用dom窗口。例如：

<script type='text/javascript'>
alert($(this)); // refers to window

$('body').bind('click', function() {
    alert($(this)); // refers to the jQuery object created by selecting the body element.
});
</script>

Answer 4

对于$（this）工作（或者这个），它必须与元素相关。例如：

<a href="#" onclick="alert($(this).html());return false">test</a>

或者，在选择器循环中：

$('.someClass').each(function() {
   $(this).css('background-color','#333');
});

JQuery $这个选择器 - 如何让它工作

4 个答案: