function changeIt(picUrl)
{
//...
$("inid").innerHTML="<img src='"+picurl+"' >"
//...
}<div id="inid"><img src=.... /></div>
<input type="text" id="mytext" name="mytext" value="" onchange="javascript:changeIt(this.value);">
问题背景:
希望通过改变text里的值 而自动改变 上面div里显示的图片img
当我输入新的图片地址的时候,发现上面的图片不会变化啊。郁闷。
其实有2种情况:
1,如果我手工直接修改text里的值,那么我必须将鼠标点一下text外面空白处,才能激活那个函数,才能改变图片。 如果光标一直聚焦在text里,那么不会变化。
2,我通过别的对象对text的值进行修改,比如 我点某个按钮,使得text的值改变;或者我是通过弹出一个上传窗口,上传图片后返回图片地址,再将地址赋值给text。也就是说 鼠标没有点那个text然后再移动到外部,再激活那个函数。
我现在这2种情况都遇到了。都搞不定。希望大家帮帮我。
<html>
<head>
<title> New Document </title>
</head> <body>
<script type="text/javascript">
var imagepath = /\.(jpg|JPG|gif|GIF|PNG|png|BMP|bmp)$/ig;
//alert(imagepath.test("C:\icon.gif"));
function changeIt(picUrl)
{
//...
if(imagepath.test(picUrl)){
document.getElementById("msg").innerHTML = "";
document.getElementById("inid").innerHTML="<img src='"+picUrl+"' >"
}
else{
document.getElementById("msg").innerHTML = "不是有效的图片格式";
}
//...
} </script>
<input type="text" onkeyup="changeIt(this.value);" id="txtImagePath"/>
<input type="file" onchange="changeIt(this.value);" />
<div id="msg" style="color:red"></div>
<div id="inid"></div>
</body>
</html>
<input type="text" onkeyup="changeIt(this.value);" id="txtImagePath"/>
onkeyup 只是响应 键盘按下再起来的事件啊!!如果 我是通过别的方法 改变了 text里的值,那就不能自动执行 onkeyup="changeIt(this.value);" 了
<input type="text" onpropertychange="changeIt(this.value);" id="txtImagePath"/>