Javascript 如何在单击其中一个图像时切换两个图像？
我的页面中有一个文本字段和一个小图标（edit.png）。最初文本字段处于Javascript 如何在单击其中一个图像时切换两个图像？,javascript,jquery,image,toggle,Javascript,Jquery,Image,Toggle,我的页面中有一个文本字段和一个小图标（edit.png）。最初文本字段处于readonly模式&当我单击此edit.png时，它会从文本字段中删除属性readonly。它工作正常，但现在我想这样做：当单击edit.png时，它应该从文本字段中删除属性readonly，并且图标本身将更改为save.png图标。这是我的密码。请建议我应该在哪里改变以实现这一点 <html> <head> <script language="JavaScript">
readonlyedit.pngreadonly当单击
edit.pngreadonlysave.png<html>
<head>
<script language="JavaScript">
function removeAlignment(x){
var read=document.getElementById(x).removeAttribute("readonly",0);
if(document.getElementById("toogle").value==="OK")
{
document.getElementById("toogle").value="SAVE";
}
}
</script>
<style type="text/css">
a.table-actions-button {
width: 1.25em;
height: 1.25em;
display: inline-block;
background-position: center center;
}
.ic-table-edit { background-image: url("actions-edit.png"); }
</style>
</head>
<body>
<p>
<label for="email">Email</label>
<input type="text" name="email" id="email" value="abcd@dsa.com" readonly="readonly"/>
<a href="#" class="table-actions-button ic-table-edit" title="Edit" onclick="removeAlignment('email');"></a>
</p>
<input type="submit" id="toogle" value="OK" />
</body>
函数removeAlignment（x）{
var read=document.getElementById（x）.removeAttribute（“只读”，0）；
if（document.getElementById（“toogle”）.value==“OK”）
{
document.getElementById（“toogle”）.value=“保存”；
}
}
a、 表操作按钮{
宽度：1.25em；
高度：1.25em；
显示：内联块；
背景位置：中心；
}
.ic表编辑{背景图像：url（“actions edit.png”）；}
电子邮件
if(document.getElementById("toogle").value==="OK")
{
document.getElementById("toogle").value="SAVE";
$('.ic-table-edit').css('background-image', 'url("actions-save.png")');
}
确保代码中包含了j查询插件。 在锚定标记中，将图像的
属性包含到新图像中。
找到下面的示例代码
<html>
<head>
<script>
function removeAlignment(x){
var read=document.getElementById(x).removeAttribute("readonly",0);
if(document.getElementById("toogle").value==="OK")
{
document.getElementById("toogle").value="SAVE";
$("#image").attr("src","actions-save.png");
}
}
</script>
<style type="text/css">
a.table-actions-button {
width: 1.25em;
height: 1.25em;
display: inline-block;
background-position: center center;
}
</style>
</head>
<body>
<p>
<label for="email">Email</label>
<input type="text" name="email" id="email" value="abcd@dsa.com" readonly="readonly"/>
<a href="#" class="table-actions-button ic-table-edit" title="Edit" onclick="removeAlignment('email');"><img src="actions-edit.png" id="image"></a>
</p>
<input type="submit" id="toogle" value="OK" />
</body>
</html>
函数removeAlignment（x）{
var read=document.getElementById（x）.removeAttribute（“只读”，0）；
if（document.getElementById（“toogle”）.value==“OK”）
{
document.getElementById（“toogle”）.value=“保存”；
$（“#image”）.attr（“src”、“actions save.png”）；
}
}
a、 表操作按钮{
宽度：1.25em；
高度：1.25em；
显示：内联块；
背景位置：中心；
}
电子邮件
r您是否测试过它？它不起作用了。我在函数removeAlignment（x）之前附加它{