Question

出于某种原因，我必须使用带有jquery的纯js。我有这样的标签

<a onclick="openClose()">Click</a>
<div class="spoilermain">content</div>

这是我的js

    function openClose(){
        $('.spoilertop').next('.spoilermain').toggle();
    }

问题是，如果有多个spoilertop，那么所有将被切换。在这种情况下如何使用$（this）？我知道我可以选择a然后使用$（this）但由于某种原因我必须解雇openClose（）。

Answer 1

您可以删除onclick事件，添加一个开放式课程

<a class=".open-close">Click</a>

然后只需调用你的脚本：

$('.open-close').click(function(){
        $(this).next('.spoilermain').toggle(); 
});

Answer 2

在函数调用

时将其作为参数传递

html代码

<a onclick="openClose(this)">Click</a>
<div class="spoilermain">content</div>

javascript代码

function openClose(ele){
        $(ele).next('.spoilermain').toggle();
    }

Answer 3

这个怎么样？通过＆＃34;这个＆＃34;作为你的html中的onclick函数处理程序的参数，你可以在以后的函数中使用它

<a onclick="openClose(this)">Click</a>
    <div class="spoilermain">content</div>

JS

function openClose(obj){
    $(obj).next('.spoilermain').toggle();
  // this is available here
}

<强>演示：

＆＃13;

function openClose(obj){
    $(obj).next('.spoilermain').toggle();
  // this is available here
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a onclick="openClose(this)">Click</a>
    <div class="spoilermain">content</div>

＆＃13;

$（this）点击事件中的混淆

3 个答案: