0

我想在输入后切换第一个 div

是否可以？

我试过了

<script type="text/javascript">
function spoiler() {
    $(this).next().show();
}
</script>

<div>
       <input value="Show/Hide" style="" onclick="spoiler();" type="button"/>
</div>
<div style="display:none;">
    Text
</div>

我不能使用类或 ID

4

6 回答 6

0

试一试：

$(this).parent().next().show();
于 2012-11-14T00:16:17.483 回答
0

您需要使用：

$(this).parent().next().show();

你需要遍历树的一个地方，因为你已经在里面了<div />。

于 2012-11-14T00:16:21.407 回答
0

如果您知道 DOM 中的确切位置，您可以执行诸如$('div:nth-child(2)')选择元素之类的操作，但这将非常脆弱 - 对标记的更改可能会破坏您的脚本。

于 2012-11-14T00:16:42.753 回答
0

因为 next() 引用的是 div 中的下一个元素，而不是下一个父 div

使用 parent().next().show()

于 2012-11-14T00:16:43.963 回答
0

您的代码不起作用，因为$(this)没有引用您的按钮。另外，.next()在按钮之后查找不存在的元素。您正在寻找该按钮的父级之后的元素。

此外，不要使用 绑定事件，而是onclick使用 JavaScript 完全绑定它：

$(document).ready(function() {
    $('input[value="Show/Hide"]').click(function() {
        $(this).parent().next('div').toggle();
    });
});​

然后，您可以简化 HTML：

<div>
   <input value="Show/Hide" type="button" />
</div>

<div style="display:none;">
    Text
</div>​

演示：http: //jsfiddle.net/NXM7w/

于 2012-11-14T00:17:39.747 回答
0

您正在引用全局变量 'this' 您当前使用它的方式。让你的 DIV 通过自己，然后你可以很容易地从那里工作：

<div>
       <input value="Show/Hide" style="" onclick="spoiler(this)" type="button"/>
</div>
<div style="display:none;">
    Text
</div>

然后你的 JS 函数可以如下所示：

function spoiler(div1) {
    $(div1).parent().next().toggle();
}

希望这对你有用。

于 2012-11-14T00:31:21.457 回答