javascriptテキストボックスのラベル検証を実現するコードの実例
13216 ワード
具体的なコードは以下の通りです.
< !DOCTYPE html > Document < /title>
<style type="text/css"> body {
background: #ccc;
}
label {
width: 100px;
display: inline - block;
}
span {
color: red;
}.container {
margin: 100px auto;
width: 400px;
padding: 50px;
line - height: 40px;
}
span {
margin - left: 30px;
font - size: 12px;
} < /style>
<body>
<div class="container">
<label> </label > <input type = "text"id = "inp1" > <span > </span><br/ > <label > phone < /label><input type="text" id="inp2"><span></span > <br / ></div>
<script>
/ /
var inp1 = document.getElementById("inp1");
inp1.onblur = function() {
if (trim(this.value) === "") {
alert(" ");
} else {
alert(" ");
}
};
function trim(str) {
return str.replace(/^\s+|\s+$/g, "");
}
var inp2 = document.getElementById("inp2");
inp2.onblur = function(e) {
if (inp2.value == "4444") {
alert(" ");
e.stopPropagation();
} else {
alert(" ")
}
}; < /script>
</body >
</html>
</pre>
</div>
<p><span style="color: #ff0000"><strong> </strong></span></p>
<p> javascript ， ， ， ！</p>
<div class="clearfix">
<span id="art_bot" class="jbTestPos"></span>
</div>
</div>
</div>
</div>
</div>
<!--PC WAP -->
<div id="SOHUCS" sid="1175886771804778496"></div>
<script type="text/javascript" src="/views/front/js/chanyan.js"></script>
<!-- - -->
<div class="youdao-fixed-ad" id="detail_ad_bottom"></div>
</div>
<div class="col-md-3">
<div class="row" id="ad">
<!-- - 1 -->
<div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
<div class="youdao-fixed-ad" id="detail_ad_1"> </div>
</div>
<!-- - 2 -->
<div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
<div class="youdao-fixed-ad" id="detail_ad_2"></div>
</div>
<!-- - 3 -->
<div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
<div class="youdao-fixed-ad" id="detail_ad_3"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<h4 class="pt20 mb15 mt0 border-top"> </h4>
<div id="paradigm-article-related">
<div class="recommend-post mb30">
<ul class="widget-links">
<li><a href="/article/8.htm"
title="LeetCode[Math] - #66 Plus One" target="_blank">LeetCode[Math] - #66 Plus One</a>
<span class="text-muted">Cwind</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/LeetCode/1.htm">LeetCode</a><a class="tag" taget="_blank" href="/search/%E9%A2%98%E8%A7%A3/1.htm"> </a><a class="tag" taget="_blank" href="/search/Algorithm/1.htm">Algorithm</a><a class="tag" taget="_blank" href="/search/Math/1.htm">Math</a>
</li>
<li><a href="/article/135.htm"
title="JQuery $.ajax() " target="_blank">JQuery $.ajax() </a>
<span class="text-muted">AILIKES</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jsonp/1.htm">jsonp</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a>
</li>
<li><a href="/article/262.htm"
title="JConsole & JVisualVM Webphere JVM" target="_blank">JConsole & JVisualVM Webphere JVM</a>
<span class="text-muted">Kai_Ge</span>
<a class="tag" taget="_blank" href="/search/JVisualVM/1.htm">JVisualVM</a><a class="tag" taget="_blank" href="/search/JConsole/1.htm">JConsole</a><a class="tag" taget="_blank" href="/search/Webphere/1.htm">Webphere</a>
</li>
<li><a href="/article/389.htm"
title=" annotation" target="_blank"> annotation</a>
<span class="text-muted">120153216</span>
<a class="tag" taget="_blank" href="/search/annotation/1.htm">annotation</a>
</li>
<li><a href="/article/516.htm"
title="CentOS 5/6.X EPEL YUM " target="_blank">CentOS 5/6.X EPEL YUM </a>
<span class="text-muted">2002wmj</span>
<a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a>
</li>
<li><a href="/article/643.htm"
title=" SQLSERVER SQL" target="_blank"> SQLSERVER SQL</a>
<span class="text-muted">357029540</span>
<a class="tag" taget="_blank" href="/search/SQL+Server/1.htm">SQL Server</a>
</li>
<li><a href="/article/770.htm"
title="Spring3 MVC （ ） —json+rest " target="_blank">Spring3 MVC （ ） —json+rest </a>
<span class="text-muted">7454103</span>
<a class="tag" taget="_blank" href="/search/Spring3+MVC/1.htm">Spring3 MVC</a>
</li>
<li><a href="/article/897.htm"
title=" “\” Unexpected internal error near index 1 \ ^" target="_blank"> “\” Unexpected internal error near index 1 \ ^</a>
<span class="text-muted">adminjun</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E2%80%9C%5C%E6%9B%BF%E6%8D%A2%E2%80%9D/1.htm">“\ ”</a>
</li>
</ul>
</div>
</div>
</div>
<div>
<div class="container">
<div class="indexes">
<strong> ：</strong>
<a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a
href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a
href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a
href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a
href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a
href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a
href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a
href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a
href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank"> </a>
</div>
</div>
</div>
<footer id="footer" class="mb30 mt30">
<div class="container">
<div class="footBglm">
<a target="_blank" href="/"> </a> -
<a target="_blank" href="/custom/about.htm"> </a> -
<a target="_blank" href="/search/Java/1.htm"> </a> -
<a target="_blank" href="/sitemap.xml">Sitemap</a> -
<a target="_blank" href="/custom/delete.htm"> </a>
</div>
<div class="copyright"> IT CopyRight © 2000-2050 IT IT610.com , All Rights Reserved.
<a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank"> ICP 09083238 </a><br>
</div>
</div>
</footer>
<!-- -->
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script>
<link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/>
<script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script>
</body>
</html></style>