我希望使用JQuery而不是普通的JavaScript更改几个图像,并同时更改图像alt属性以便访问.
它应该是容易的,因为我不打算对变化做一些特殊的影响,但我仍然没有找到任何关于它的东西.
这是我使用JS的方式(不更改alt属性):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Change Image using Javascript</title>
<script type="text/javascript">
function changeImg(image_id, image_folder){
document.getElementById(image_id).src = image_folder;
}
</script>
</head>
<body>
<div align="center">
<img id="image1" src="images/nameofthesubfolder/originalimage1.jpg" alt="Original Image 1" />
<br />
<label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image1.jpg')"/>Image 1</label>
<label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image2.gif');"/>Image 2</label>
<label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image3.png');"/>Image 3</label>
<label><input type="radio" name="radio_btn1" onclick="changeImg('image1', 'images/nameofthesubfolder/image4.jpeg');"/>Image 4</label>
<br />
<br />
<img id="image2" src="images/nameofthesubfolder/originalimage2.jpg" alt="Original Image 2" />
<br />
<label><input type="radio" …这个问题完成了我在这里问到的第一个关于如何使用jQuery更改点击图像的问题.
我忘了说(即使我后来编辑了我的帖子)我正在寻找一种方法,每次通过点击更改图像时都有不同的alt属性.
(这是为了更好的可访问性和SEO优化.)
以下是感谢altCognito的实际html代码:
<img id="radio_btn1" src="originalimage1.jpg" />
<br />
<input type="radio" name="radio_btn1" value='image1.jpg' />
<input type="radio" name="radio_btn1" value='image2.gif' />
<input type="radio" name="radio_btn1" value='image3.png' />
<input type="radio" name="radio_btn1" value='image4.jpeg' />
和jquery:
imgFldr = 'images/nameofthesubfolder/';
$("input[type='radio']").click(function() {
$('#'+this.name).attr('src', imgFldr+this.value).attr('alt', 'newattribute');
});
它可以在jsbin上编辑.
(我希望我的头衔是可以理解的,很难总结.)
我有一些脚本可以根据所选的单选按钮更改表单中的某些文本,如下所示:http: //jsbin.com/onowu/
问题是,如果某些用户输入一些文本,然后单击另一个单选按钮,它将删除他的文本.
我正在寻找的是只有当用户没有填写任何文本时才更改灰色文本.如果用户删除了他的文本,它将根据所选的单选按钮填充文本.
你可以在这里看到我的代码:http: //jsbin.com/onowu/edit