jemlive19,
http://jqueryui.com/dialog/
<html>
<head>
<title>Пример использования полей input в HTML</title>
<style type="text/css">
.dis{
color: #FF0000;
cursor: pointer;
}
.res{
display: none;
}
</style>
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div class="res" title="Информация"></div>
<p>Какие уроки интереснее всего?</p>
<p><label><input type="checkbox" name="lessons" value="HTML">HTML</label></p>
<p><label><input type="checkbox" name="lessons" value="CSS" >CSS</label></p>
<p><label><input type="checkbox" name="lessons" value="PHP" >PHP</label></p>
Нравится ли вам данный сайт?
<p><label><input type="radio" name="vopros" value="yes"> Да</label></p>
<p><label><input type="radio" name="vopros" value="no"> Нет</label></p>
<p><label><input type="radio" name="vopros" value="none" checked> Трудно ответить</label></p>
Текст
<input type="text" name="comment">
<input type="text" name="comment">
<div class="dis">dis</div>
<script type="text/javascript">
$(function() {
function count() {
var check = $("input:checkbox:checked"),
radio = $("input:radio:checked"),
text = $("input:text").filter(function(i, v) {
return v.value.trim()
});
return $(".res").html("checkbox : " + check.length + "<br>radio : " + radio.length + "<br>text : " + text.length)
}
$(".dis").on("click", function() {
count().dialog();
$("input").attr("disabled", "disabled")
})
});
</script>
</body>
</html>