本文介绍了输入时更改图像的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个带JavaScript的小型基本html代码。我想要的只是当我输入3时，它应该给我指定一个图像，并相应地显示9。这是演示。访问 jsbin/UVOFeGIG/1/edit
I have a small basic html code with JavaScript . All I want is when I type 3,it should show me an image as specified and for 9 accordingly. This is the demo. Visit jsbin/UVOFeGIG/1/edit
它在那里工作。我不知道为什么JavaScript不能这样工作。任何人都可以想出来吗？
Its working there. I don't know why the JavaScript doesn't work this way. Can anyone figure this out?
<!DOCTYPE html> <html> <head> <script src="ajax.googleapis/ajax/libs/jquery/2.0.2/jquery.min.js"></script> <script type="text/javascript"> var num2img = { "3":"visa", "9":"mastercard" }; $('#num').on('input', function(){ var val = this.value; if(val.length<=1){ var n = this.value.charAt(0); if(val && num2img[n]!==undefined){ $('#cardImage')[0].src = 'placehold.it/100x100/eee&text='+ num2img[n] +'.png'; }else{ $('#cardImage')[0].src = 'placehold.it/100x100/cf5'; } } }); </script> <meta charset=utf-8 /> <title>Demo by Roko C.B.</title> </head> <body> <input id="num"><br> <img id="cardImage" src="placehold.it/100x100/cf5"> </body> </html>推荐答案
试试这个
Try this
$(document).ready(function(){ var num2img = { "3":"visa", "9":"mastercard" }; $('#num').keyup(function(){ var val = this.value; if(val.length<=1){ var n = this.value.charAt(0); if(val && num2img[n]!==undefined){ $('#cardImage')[0].src = 'placehold.it/100x100/eee&text='+ num2img[n] +'.png'; }else{ $('#cardImage')[0].src = 'placehold.it/100x100/cf5'; } } }); });DEMO
更多推荐
输入时更改图像
发布评论