如何读取存储在图像的数据src中的URL,并在另一个img控制器的src中设置该URL onclick
How to read URL which stored in a data-src of a image and set that URL in src of another img controller onclick?
我正在使用ASP.net开发网站。在那里的一个页面中,我正在使用此代码为图像库生成img控件。
foreach (string url in listImageUrl)
{
LiteralControl lit = new LiteralControl();
lit.Text = String.Format("<img src='/Images/Thumbnail/{0}' data-url='/Images/Full/{0}' id='imgThumbnail' onclick='loadFullImage(this)'/>", url);
pnlThumbnailImage.Controls.Add(lit);
}
然后我将pnlThumbnailImage添加到页面中的占位符中。
页面中还有另一个img控件。事情是这样的。
<img id="imgFull" src="" />
我想做的是,当用户点击缩略图上方时,存储在"data url="中的完整图像路径应该应用于imgFull控件(另一个img控制器)的src。
那么如何在javascript中做到这一点呢?
我编写了这个javascript函数。但它没有起作用。
function loadFullImage(ctrl)
{
var image = document.getElementById(ctrl);
var imgFull = document.getElementById("imgFull");
imgFull.src = image.getAttribute("data-url");
}
谢谢。
loadFullImage()
函数中的ctrl
参数不是图像元素的id,而是单击它本身的HTML DOM元素。因此,您的代码应该是这样的:
function loadFullImage(ctrl)
{
var url = ctrl.getAttribute('data-url');
var imgFull = document.getElementById("imgFull");
imgFull.src = url;
}
相关文章:
- 在字符串中查找所有图像 src URL 并存储在数组中
- 如何使用jquery或javascript在image src中添加域url
- 为什么html src属性中的相对url是因为Javascript函数中的完整路径
- 对URL进行编码并将其放在javascript src中
- img src 属性在为空时返回页面的 URL
- EmberJS config prod img src url
- 为什么当我尝试为iframe-src属性构建URL时,AngularJS会抛出错误
- 阻止Rails 4转换src-url
- 如何读取存储在图像的数据src中的URL,并在另一个img控制器的src中设置该URL onclick
- 为什么 ExpressionEngine 似乎从 iframe 客户端中删除了 src URL
- 获取在 <脚本 src >标记中添加的请求 URL 的状态
- Javascript RegExp 解析 URL 使超链接忽略 img src
- AngularJS - img ng-src 到 base64 数据(不是 url)不起作用
- 如何在跨域更改 iframe SRC URL 锚标记属性 target=_blank
- 比较 IMG SRC + A 包装 URL 字符串,看看它们是否“相似”
- Using Javascript for iFrame src URL
- 如何将css类名附加到特定的图像src-url
- angular ng显示/隐藏取决于img src url
- 在javascript中将image src设置为url
- iFrames:改变相对URL src's命中的根URL