只有当点击输入时才显示div

Question

仅当我按下输入或textarea时如何显示div？

此外，CSS写入是否正确？ ..或有一些错误？

演示代码：http://jsfiddle.net/2wNbR/54/

谢谢回答！

Answer 1

$(document).ready(function() { 
    $(".info_form").hide(); 
    $("input").on("focus", function() { 
     $(".info_form").hide(); 
     $(this).next('div.info_form').show(); 
    }); 
}); 

看到这里http://jsfiddle.net/2wNbR/58/

--------- EDITED ----------------

$(document).ready(function() { 
    $(".info_form").hide(); 
    $("input").on("focus", function() { 
     $(".info_form").hide(); 
     $(this).next('div.info_form').show(); 
    }); 

    $(document).click(function(e) { 
     if (!$(e.target).is('input')) { 
      $(".info_form").hide(); 
     } 
    }); 
}); 

http://jsfiddle.net/2wNbR/62/

只需在css中的.info_form类中添加float:left;即可。它将保持内联。

Answer 2

你有没有试过把它藏在ready（）上并点击显示它？

$(document).ready(function() { 
    $(".info_form").hide(); 
    $("input").on("focus", function() { 
     $(".info_form").show(); 

    }); 
}); 

Answer 3

修改.info_form类和JS代码。这里是结果url
http://jsfiddle.net/2wNbR/60/

希望这可以解决您的问题。