jQuery/JS如何監(jiān)聽(tīng)input輸入框的值-創(chuàng)新互聯(lián)

這篇文章給大家分享的是有關(guān)jQuery/JS如何監(jiān)聽(tīng)input輸入框的值的內(nèi)容。小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧。

成都創(chuàng)新互聯(lián)公司堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：做網(wǎng)站、網(wǎng)站制作、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時(shí)代的松滋網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

input事件：

onchange：

1、要在 input 失去焦點(diǎn)的時(shí)候才會(huì)觸發(fā)；

2、在輸入框內(nèi)容變化的時(shí)候不會(huì)觸發(fā)change，當(dāng)鼠標(biāo)在其他地方點(diǎn)一下才會(huì)觸發(fā)；

3、onchange event 所有主要瀏覽器都支持；

4、onchange 屬性可以使用于：, 。</p><pre><script> function change(){ var x=document.getElementById("password"); x.value=x.value.toUpperCase();<br data-filtered="filtered">　　　　console.log("出發(fā)了") } </script> </head> <body> 輸入你的密碼: <input type="text" id="password" onchange="change()"> </body></pre><p><strong>oninput:</strong></p><p>1、在用戶輸入時(shí)觸發(fā)，它是在元素值發(fā)生變化時(shí)立即觸發(fā)；</p><p>2、該事件在 <input> 或 <textarea> 元素的值發(fā)生改變時(shí)觸發(fā)。</p><p>3、缺陷：從腳本中修改值不會(huì)觸發(fā)事件。從瀏覽器下拉提示框里選取值時(shí)不會(huì)觸發(fā)。IE9 以下不支持，所以IE9以下可用onpropertychange 事件代替。</p><pre>JS: <input type="text" id="password" oninput="change()"></pre><pre>jQuery： $("#password").on('input propertychange', change);</pre><p><strong>onpropertychange:</strong></p><p>1、會(huì)實(shí)時(shí)觸發(fā)，會(huì)在元素的屬性改變時(shí)就觸發(fā)事件。當(dāng)元素disable=true時(shí)不會(huì)觸發(fā)</p><p>2、缺陷：只在IE 下支持，其他瀏覽器不支持，用oninput來(lái)解決。</p><pre><input type="text" id="password" oninput="onpropertychange()"></pre><p><strong>jQuery:</strong></p><pre><!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>RunJS</title> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> </head> <body> <input type="text" id="password" autoComplete='off'> <script type="text/javascript"> $(function(){ 　　$('#password').bind('input propertychange', function() { <br data-filtered="filtered">　　　　 console.log('在實(shí)時(shí)觸發(fā)?。。?#39;) 　　$('#result').html($(this).val().length); <br data-filtered="filtered"> 　　　　$(this).val().length != 0 ? $("#login").css("background-color", "#086AC1") : $("#login").css("background-color", "#529DE0") 　　}); }) </script> </body> </html></pre><p><strong>JavaScript;</strong></p><pre><script type="text/javascript"> // Firefox, Google Chrome, Opera, Safari, Internet Explorer from version 9 function OnInput (event) { alert ("The new content: " + event.target.value); } // Internet Explorer function OnPropChanged (event) { if (event.propertyName.toLowerCase () == "value") { alert ("The new content: " + event.srcElement.value); } } </script> <input type="text" oninput="OnInput (event)" onpropertychange="OnPropChanged (event)" value="Text field" /></pre><p>感謝各位的閱讀！關(guān)于“jQuery/JS如何監(jiān)聽(tīng)input輸入框的值”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！</p> <br> 網(wǎng)頁(yè)題目：jQuery/JS如何監(jiān)聽(tīng)input輸入框的值-創(chuàng)新互聯(lián) <br> URL鏈接：<a href="http://weahome.cn/article/csjphs.html">http://weahome.cn/article/csjphs.html</a> </div> </div> </div> <div id="squ6kqw" class="other container"> <h3>其他資訊</h3> <ul> <li> <a href="/article/hsdogi.html">怎么讀mysql數(shù)據(jù)庫(kù),MYsql怎么讀</a> </li><li> <a href="/article/hsdops.html">php隨機(jī)取數(shù)據(jù)庫(kù)數(shù)據(jù),php隨機(jī)獲取數(shù)組元素</a> </li><li> <a href="/article/hsdoho.html">新macos10系統(tǒng)的簡(jiǎn)單介紹</a> </li><li> <a href="/article/hsdoeg.html">Java代碼加密,java代碼加密封裝</a> </li><li> <a href="/article/hsdojj.html">vb.net制作管理系統(tǒng),VBNET教程</a> </li> </ul> </div> <div id="squ6kqw" class="footer"> <div id="squ6kqw" class="foota container"> <div id="squ6kqw" class="foot_nav fl col-lg-8 col-md-8 col-sm-12 col-xs-12"> <ul> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>網(wǎng)站制作</h3> <a target="_blank">網(wǎng)站制作公司</a><a target="_blank">成都網(wǎng)站制作</a><a target="_blank">網(wǎng)站制作公司</a><a target="_blank">手機(jī)網(wǎng)站制作</a><a target="_blank">成都網(wǎng)站制作</a><a target="_blank">成都企業(yè)網(wǎng)站制作</a> </li> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>企業(yè)服務(wù)</h3> <a target="_blank">軟文發(fā)布平臺(tái)</a><a target="_blank">軟文營(yíng)銷(xiāo)</a><a target="_blank">免費(fèi)收錄</a><a target="_blank">網(wǎng)站免費(fèi)收錄</a><a target="_blank">廣播電視節(jié)目制作許可證</a><a target="_blank">軟文平臺(tái)</a> </li> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>網(wǎng)站建設(shè)</h3> <a target="_blank">網(wǎng)站建設(shè)</a><a target="_blank">營(yíng)銷(xiāo)型網(wǎng)站建設(shè)</a><a target="_blank">營(yíng)銷(xiāo)型網(wǎng)站建設(shè)</a><a target="_blank">成都響應(yīng)式網(wǎng)站建設(shè)</a><a target="_blank">成都網(wǎng)站建設(shè)</a><a target="_blank">成都網(wǎng)站建設(shè)</a> </li> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>服務(wù)器托管</h3> <a target="_blank">服務(wù)器托管機(jī)房</a><a target="_blank">光華服務(wù)器托管</a><a target="_blank">機(jī)柜租用</a><a target="_blank">重慶電信水土機(jī)房托管</a><a target="_blank">服務(wù)器托管機(jī)柜</a><a target="_blank">移動(dòng)服務(wù)器托管</a> </li> </ul> </div> <div id="squ6kqw" class="footar fl col-lg-4 col-md-4 col-sm-12 col-xs-12"> <p>全國(guó)免費(fèi)咨詢:</p> <b>400-028-6601</b> <p>業(yè)務(wù)咨詢：028-86922220 / 13518219792</p> <p>節(jié)假值班：18980820575 / 13518219792</p> <p>聯(lián)系地址：成都市太升南路288號(hào)錦天國(guó)際A幢1002號(hào)</p> </div> </div> <div id="squ6kqw" class="footb"> <div id="squ6kqw" class="copy container"> <div id="squ6kqw" class="fl">Copyright ? 成都創(chuàng)新互聯(lián)科技有限公司重慶分公司 <a target="_blank">渝ICP備2021005571號(hào)</a></div>  </div> </div> <div id="squ6kqw" class="link"> <div id="squ6kqw" class="container"> 友情鏈接:： <a target="_blank">成都網(wǎng)站建設(shè)</a> <a target="_blank">重慶網(wǎng)站建設(shè)</a> <a href="">四川網(wǎng)站建設(shè)</a> <a href="">重慶建設(shè)網(wǎng)站</a> <a target="_blank">移動(dòng)服務(wù)器托管</a> <a target="_blank">成都服務(wù)器托管</a> <a target="_blank">云服務(wù)器</a> <a target="_blank">廣告設(shè)計(jì)制作</a> <a target="_blank">重慶網(wǎng)頁(yè)設(shè)計(jì)</a> <a target="_blank">重慶做網(wǎng)站</a> <a target="_blank">重慶網(wǎng)站制作</a> <a href="">重慶網(wǎng)站建設(shè)</a> <a href="">重慶網(wǎng)站公司</a> <a href="">渝中網(wǎng)站制作</a> <a href="">重慶網(wǎng)站設(shè)計(jì)</a> </div> </div> </div> <div id="squ6kqw" class="foot"> <ul class="public-celan"> <li> <a target="_blank" class="a1 db tc"> <img src="/Public/Home/img/icon-23.png" alt="" class="db auto"> <span id="squ6kqw" class="span-txt">在線咨詢</span> </a> </li> <li> <a href="tel:18980820575" class="a1 db tc"> <img src="/Public/Home/img/icon-24.png" alt="" class="db auto"> <span id="squ6kqw" class="span-txt">電話咨詢</span> </a> </li> <li> <a target="_blank" href="tencent://message/?uin=1683211881&Site=&Menu=yes" class="a1 db tc"> <img src="/Public/Home/img/icon-25.png" alt="" class="db auto"> <span id="squ6kqw" class="span-txt">QQ咨詢</span> </a> </li> <li> <a target="_blank" href="tencent://message/?uin=532337155&Site=&Menu=yes" class="a1 db tc public-yuyue-up"> <img src="/Public/Home/img/icon-26.png" alt="" class="db auto"> <span id="squ6kqw" class="span-txt">預(yù)約顧問(wèn)</span> </a> </li> </ul> </div> <div id="squ6kqw" class="customer"> <dl class="icon1"> <dt> <a href="tencent://message/?uin=1683211881&Site=&Menu=yes"> <i class="iconT"><img src="/Public/Home/img/QQ.png" alt=""></i> <p>在線咨詢</p> </a> </dt> </dl> <dl class="icon2"> <dt><i><img src="/Public/Home/img/weixin.png" alt=""></i><p>微信咨詢</p></dt> <dd><img src="/Public/Home/img/ewm.png"></dd> </dl> <dl class="icon3"> <dt><i><img src="/Public/Home/img/dianhua.png" alt=""></i><p>電話咨詢</p></dt> <dd> <p>028-86922220（工作日）</p> <p>18980820575（7×24）</p> </dd> </dl> <dl class="icon4"> <dt class="sShow"> <a href="tencent://message/?uin=244261566&Site=&Menu=yes"> <i><img src="/Public/Home/img/dengji.png" alt=""></i><p>提交需求</p> </a> </dt> </dl> <dl class="icon5"> <dt class="gotop"> <a href="#top"> <i><img src="/Public/Home/img/top.png" alt=""></i><p>返回頂部</p> </a> </dt> </dl> </div> <footer> <div class="friendship-link"> <p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p> <a href="http://weahome.cn/" title="真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆">真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆</a> <div class="friend-links"> </div> </div> </footer> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body><div id="rl1fj" class="pl_css_ganrao" style="display: none;"><strong id="rl1fj"><sup id="rl1fj"><label id="rl1fj"><nobr id="rl1fj"></nobr></label></sup></strong><meter id="rl1fj"></meter><pre id="rl1fj"></pre><ol id="rl1fj"><style id="rl1fj"><listing id="rl1fj"><dfn id="rl1fj"></dfn></listing></style></ol><thead id="rl1fj"><big id="rl1fj"></big></thead><var id="rl1fj"></var><p id="rl1fj"><var id="rl1fj"></var></p><label id="rl1fj"><video id="rl1fj"></video></label><dl id="rl1fj"><legend id="rl1fj"></legend></dl><div id="rl1fj"><ol id="rl1fj"><i id="rl1fj"><listing id="rl1fj"></listing></i></ol></div><progress id="rl1fj"><acronym id="rl1fj"></acronym></progress><track id="rl1fj"></track><ol id="rl1fj"><i id="rl1fj"></i></ol><font id="rl1fj"></font><strong id="rl1fj"><track id="rl1fj"></track></strong><listing id="rl1fj"></listing><form id="rl1fj"><video id="rl1fj"><em id="rl1fj"><menuitem id="rl1fj"></menuitem></em></video></form><th id="rl1fj"></th><thead id="rl1fj"></thead><style id="rl1fj"><listing id="rl1fj"><dfn id="rl1fj"><ruby id="rl1fj"></ruby></dfn></listing></style><dl id="rl1fj"><legend id="rl1fj"><dfn id="rl1fj"><form id="rl1fj"></form></dfn></legend></dl><strong id="rl1fj"></strong><big id="rl1fj"><acronym id="rl1fj"><legend id="rl1fj"><var id="rl1fj"></var></legend></acronym></big><p id="rl1fj"><big id="rl1fj"></big></p><cite id="rl1fj"><ruby id="rl1fj"></ruby></cite><address id="rl1fj"></address><tbody id="rl1fj"></tbody><var id="rl1fj"><strong id="rl1fj"></strong></var><delect id="rl1fj"></delect><form id="rl1fj"></form><pre id="rl1fj"></pre><code id="rl1fj"><progress id="rl1fj"><u id="rl1fj"></u></progress></code><tt id="rl1fj"></tt><ruby id="rl1fj"></ruby><mark id="rl1fj"></mark><wbr id="rl1fj"></wbr><thead id="rl1fj"></thead><table id="rl1fj"><optgroup id="rl1fj"></optgroup></table><pre id="rl1fj"></pre><span id="rl1fj"><tr id="rl1fj"></tr></span><video id="rl1fj"></video><xmp id="rl1fj"></xmp><th id="rl1fj"><nobr id="rl1fj"><code id="rl1fj"></code></nobr></th><tbody id="rl1fj"></tbody><i id="rl1fj"></i><ul id="rl1fj"><input id="rl1fj"><address id="rl1fj"><th id="rl1fj"></th></address></input></ul><ul id="rl1fj"><font id="rl1fj"></font></ul><dfn id="rl1fj"></dfn><var id="rl1fj"><object id="rl1fj"><cite id="rl1fj"><fieldset id="rl1fj"></fieldset></cite></object></var><object id="rl1fj"></object></div> </html> <script> $(".con img").each(function(){ var src = $(this).attr("src"); //獲取圖片地址 var str=new RegExp("http"); var result=str.test(src); if(result==false){ var url = "https://www.cdcxhl.com"+src; //絕對(duì)路徑 $(this).attr("src",url); } }); window.onload=function(){ document.oncontextmenu=function(){ return false; } } </script>