jquery 索引值的问题

Question

有两个input 两个p，如何点击input对应的p显示出来，js的话我懂写，刚接触jquery，请指教一下

<form>
   账号: <input type="text"/>
   <p>支持中文、字母、数字,4-20个字符</P>
   密码: <input type="password"/>
   <p>4-20个字符</P>
</form>

Answer 1

// 给input提示加了一下className
<form>
    账号:
    <input class="input-content" type="text" />
    <p class="input-tips">支持中文、字母、数字,4-20个字符</P>
    密码:
    <input class="input-content" type="password" />
    <p class="input-tips">4-20个字符</P>
</form>

$('.input-content').on({
    focus: function() {
        $(this).next('.input-tips:first').show();
    },
    blur: function() {
        $(this).next('.input-tips:first').hide();
    }
});

// 题主希望的通过索引实现
$('.input-content').each(function(i, v) {
    $(v).on({
        focus: function() {
            $('form p').eq(i).show();
        },
        blur: function() {
            $('form p').eq(i).hide();
        }
    });
});

Answer 2

$("input").on("click",functioin(){
   var index= $(this).index();
   $("p").addClass("hidden");
   $("p").eq(index).removeClass("hidden");

})

Answer 3

$("input").on("click",functioin(){
$("p").hide().eq($(this).index()).show();
})

Answer 4

<form>
账号: <input type="text"/>
<p style="display: none;">支持中文、字母、数字,4-20个字符</P>
密码: <input type="password"/>
<p style="display: none;">4-20个字符</P>
</form>

$(function(){

    $('input').on('focus',function(){
       $(this).next().show();
    }).on('blur',function(){
        $(this).next().hide();
    })
})  

Answer 5

遍历（each）取到input相应的index
jQuery("input").each(function(index,el){
jquery(el).on("click",function(){
jQuery("p").addClass("hidden");
jQuery("p").eq(index).removeClass("hidden");
});
});