怎么在html的src的值这里调用js方法或变量获取图片地址?

leedaning 2014-03-14 11:20:41
请教各位高手,怎么在html的<img src="">中调用js的函数或者js变量来指定图片路径?

<html>
<head>
<script language="javascript">
var adres="图片地址";
function imgUrl(){
document.images.imgInit.src="图片地址";
}
</script>
</head>
<body>

<img src="?" id="imgInit">

</body>
</html>

请问怎么<img src="调用js函数或者变量获取图片路径">中的src的值部分调用js函数或者变量获取图片路径?
...全文
68150 14 打赏 收藏 转发到动态 举报
写回复
用AI写文章
14 条回复
切换为时间正序
请发表友善的回复…
发表回复
soyofy 2016-11-22
  • 打赏
  • 举报
回复
引用 11 楼 leedaning 的回复:
多谢各位的热心帮助,我现在已经做好了,<img id="imgInit" alt="海边风情" src="javaScript:NextPic()" >,这样就能调用JS的函数NextPic()了。多谢版主了“就算执行了onload,你也循环调用了,要在函数中删除img的onload事件”,如果用onload确实要在函数中删掉该事件的。
哥能给个完整的代码吗? 我想学学,我刚刚html起步。一直想做个这个东西,就是没有头绪。
Devin.qu 2016-06-23
  • 打赏
  • 举报
回复
$("img").attr("src");
町町独立 2016-06-23
  • 打赏
  • 举报
回复
你这个 NextPic()函数是放在哪个位置执行,onload中吗 ?我的 NextPic() 不执行
leedaning 2014-03-14
  • 打赏
  • 举报
回复
多谢各位的热心帮助,我现在已经做好了,<img id="imgInit" alt="海边风情" src="javaScript:NextPic()" >,这样就能调用JS的函数NextPic()了。多谢版主了“就算执行了onload,你也循环调用了,要在函数中删除img的onload事件”,如果用onload确实要在函数中删掉该事件的。
Go 旅城通票 2014-03-14
  • 打赏
  • 举报
回复
你用错事件了,onload是成功加载时才会执行,src不会执行js函数,设置没用。 用onerror,不过有些浏览器不会支持onerror 就算执行了onload,你也循环调用了,要在函数中删除img的onload事件
<img id="imgInit" alt="海边风情" src="乱设置一个就行" onerror="imgUrl()" style="width:240px;height:320px;display:block;" /> 
<script language="javascript">
    function imgUrl() {
        document.images.imgInit.src = "http://avatar.csdn.net/6/E/E/1_leedaning.jpg";
    }
</script>
打字员 2014-03-14
  • 打赏
  • 举报
回复
<img src="blank.gif" onload="getRealSrc(this)" /> 先用一個很小透明的圖片作替代,加載好后執行getRealSrc方法再獲取真正的src并賦值
leedaning 2014-03-14
  • 打赏
  • 举报
回复
引用 7 楼 showbo 的回复:
因为你的src没有指定,加载不到图片导致图片再某些浏览器下是不占位置的,增加一个alt这样就能显示了 <img id="imgInit" src="?" onload="javascript:imgUrl();" alt="图片不显示替代的文字内容">
不会啊,我用的其实是有alt的:<img id="imgInit" alt="海边风情" src="javascript:imgUrl();" onload="javascript:imgUrl();" style="width:240px;height:320px;display:block;" />
Go 旅城通票 2014-03-14
  • 打赏
  • 举报
回复
因为你的src没有指定,加载不到图片导致图片再某些浏览器下是不占位置的,增加一个alt这样就能显示了 <img id="imgInit" src="?" onload="javascript:imgUrl();" alt="图片不显示替代的文字内容">
leedaning 2014-03-14
  • 打赏
  • 举报
回复
引用 5 楼 microlab2009 的回复:
<img src="?" id="imgInit" onclick="方法()">还有其他的事件属性都是可以的 ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup
<img id="imgInit" src="?" onload="javascript:imgUrl();">不知道这个可行吗?我试试的不行。
嘻哈大咖秀 2014-03-14
  • 打赏
  • 举报
回复
<img src="?" id="imgInit" onclick="方法()">还有其他的事件属性都是可以的 ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup
leedaning 2014-03-14
  • 打赏
  • 举报
回复
引用 3 楼 microlab2009 的回复:
[quote=引用 2 楼 leedaning 的回复:] 我是想在<img src="?" id="imgInit">里面“?”的地方调用执行JS函数或者JS变量,从而得到图片的路径,不是先执行JS方法改变图片src,是想在<img>标签里src的位置调用JS代码。不知道我这么说各位明白了没有,希望大家能够多多指点!
src里面放的就是图片地址啊 你这里面放函数或者JS变量 那你的图片的路径放哪?[/quote] 图片路径就是JS变量或者是调用的JS函数里面设置此处图片的src路径。img标签怎么调用js的函数呢?
嘻哈大咖秀 2014-03-14
  • 打赏
  • 举报
回复
引用 2 楼 leedaning 的回复:
我是想在<img src="?" id="imgInit">里面“?”的地方调用执行JS函数或者JS变量,从而得到图片的路径,不是先执行JS方法改变图片src,是想在<img>标签里src的位置调用JS代码。不知道我这么说各位明白了没有,希望大家能够多多指点!
src里面放的就是图片地址啊 你这里面放函数或者JS变量 那你的图片的路径放哪?
leedaning 2014-03-14
  • 打赏
  • 举报
回复
我是想在<img src="?" id="imgInit">里面“?”的地方调用执行JS函数或者JS变量,从而得到图片的路径,不是先执行JS方法改变图片src,是想在<img>标签里src的位置调用JS代码。不知道我这么说各位明白了没有,希望大家能够多多指点!
嘻哈大咖秀 2014-03-14
  • 打赏
  • 举报
回复
<html>
<head>

</head>
<body>

<img src="?"  id="imgInit">

</body>
<script language="javascript">
var adres="图片地址";
document.getElementById('imgInit').src = adres;

</script>
</html>
一、网页设计与策划01 网页与网站的概念02 网页核心技术(HTML/CSS/JAVASCRIPT)简介03 什么是HTML04 什么是CSS05 什么是JavaScript06 网页的设计流程07 HTML5概述、浏览器及内核08 编写第一个HTML页面09 HTML页面基本结构10 章节练习二、网页的基本实现(HTML标签)01 HTML基本语法02 标签及属性03 标签04 标题标签05 段落标签06 水平分隔线标签07 换行标签08 文本的格式化标签09 特殊字符标签10 图像标签14 相对路径与绝对路径11 章节练习-《清平乐》12 章节练习-《李清照简介》13 章节练习-《家电排行》15 章节练习-《百度网简介》16 超级链接标签17 锚点链接18 影像地图19 《table》表格标签20 无序列表标签21 有序列表标签22 定义列表标签23 章节练习-《工资明细》24 章节练习-《我的电脑》25 章节练习-《在线考试》三、层叠样式表01 CSS简介02 CSS样式规则03 CSS样式的调用方法04 标签选择器05 类选择器06 ID选择器07 标签指定式选择器08 包含(后代)选择器09 群组选择器10 通配符选择器11 属性选择器12 关系选择器13 链接伪类选择器四、样式属性01 字体属性02 文本属性03 阴影效果04 对象内溢出文本05 背景设置06 定义列表的样式五、盒模型网页布局01 初识盒子模型02 边框属性(border)03 边距属性(padding与margin)04 圆角边框05 阴影效果06 浮动属性(float)07 元素定位(position)08 溢出属性(overflow)

87,904

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧