test/iframe.html
<html>
<head>
<script src="../js/libs/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css" media="screen">
input, select {
display: block;
}
iframe {
border: 2px solid #666;
padding: 5px;
margin: 5px;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
var inputChangeEvent = 0, inputBlurEvent = 0;
$("input, select").on('change', function() {
inputChangeEvent++;
var numberOfControls = $("input, select").size();
$("#i_onchange").text("[Total elements " + numberOfControls + "] Change event on input & select elements = " + inputChangeEvent);
});
$("input, select").on('blur', function() {
inputBlurEvent++;
var numberOfControls = $("input, select").size();
$("#i_onblur").text("[Total elements " + numberOfControls + "] Blur event on input & select elements = " + inputBlurEvent);
});
});
</script>
</head>
<body>
First Name: <input type="text" name="first_name" id="first_name" placeholder="Enter first name">
Surname Name: <input type="text" name="surname" id="surname" placeholder="Enter surname name">
Last Name: <input type="text" id="ending" placeholder="Enter last name">
Full Name: <input type="text" name="full-name" id="full_name" placeholder="Enter full name">
Number: <input id="listMetrics0.value" name="listMetrics[0].value" placeholder="number" class="input" type="number" value="">
Email: <input type="text" ng-model="email">
Domain: <input type="url" name="domain">
Quantity: <input type="number" name="quantity">
Length: <input type="text" placeholder="enter length">
Email: <input type="email" name="random">
Password: <input type="password" name="password">
Email: <input type="text" name="email-address">
Select: <select name="country">
<option value="a">India</option>
<option value="b">Canada</option>
<option value="c">US</option>
</select>
Random: <input type="text" name="random-text">
Card: <input type="number" name="cardnumber">
Card: <input type="text" name="cc" placeholder="Enter card number">
Card: <input id="cc-number" type="tel" size="20" maxlength="20" name="number" autocomplete="off" placeholder="Card number" value="">
CVV: <input type="text" name="cvv" placeholder="CVV/CVV2">
CVV2: <input type="number" name="cvv2" placeholder="CVV2">
<div id="i_onchange">No change event invoked</div>
<div id="i_onblur">No blur event invoked</div>
</body>
</html>