Question

我正在尝试使用jquery选择下面HTML文档中的所有输入，并在'keydown'事件中选择'this'，然后显示下一个元素。

我的jQuery

$(document).ready(function(){
    $('.hint').hide();
});
    $('input').keydown(function(){
        $(this).show();
});

我的HTML

<!DOCTYPE html>
<html>
<head>
<title>Title of my Page</title>
</head>
<body>

<p>
    <input type="text"><span class="hint">Something cool</span>
</p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="app.js"></script>
</body>
</html>

Answer 1

不清楚你在问什么，但你的第二个功能是在页面准备就绪后没有运行所以要小心在脚本之前加载DOM。

$(document).ready(function(){

    $('.hint').hide();

    $('input').keydown(function(){
        $(this).show();
    });

});

要显示下一个元素，请将更改行更改为：

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

Answer 2

也许你可以尝试在jQuery中使用.next（[selector]）函数。（我假设您要显示.hint范围）

$(document).ready(function() {
    $('.hint').hide();
});
$('input').keydown(function() {
    $(this).next('.hint').show();
});

以下是一个示例：http://jsfiddle.net/RQ3zw/

Answer 3

啊！找到了！

只需要添加

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

取代

$(this).show();

如此完成，这将是：

$(document).ready(function(){
    $('.hint').hide();
});
    $('input').keydown(function(){
        $(this).next().show();
});

Answer 4

使用.next()选择器：

$(this).next('.hint').show();

Fiddle here.

jQuery：无法选择所有输入，在keydown上选择'this'并显示下一个元素

4 个答案: