Question

不知道我做错了什么......我正在尝试使用带有两个参数的功能来更改点击的图像来替换“kendal”。第三行中的图像并更改“写入”＃39;当点击不同的图像时，第四行中的文本变为不同的东西....有没有人看到任何错误？

</style>

<script>
function changes(newMessage, imageName)
{
var elementToUpdate = document.getElementById("writing")
elementToUpdate.innerHTML = newMessage

var toChange = document.getElementById("kendal")
toChange.src = imageName
}
</script>

</head>
<body>

<form name="tform" id="tform">

<table id="table" name="table" border="1">
<tbody id="tablebody" name="tablebody">

<tr id="firstrow" name="firstrow">
    <th id="header1" name="header1" colspan="5">Click on Image to 
Enlarge</th>
</tr>

<tr id="secondrow" name="secondrow">

    <td id="svu" name="svu">
    <input type="image" 
    src="svu-tNail.jpg" 
    alt="Law Order SVU"
    name="svupic" id="svupic"
    onclick="changes('svu.jpg, Saint Leo Graduation 2016')">
    </td>

    <td id="ocean" name="ocean">
    <input type="image" 
    src="ocean-tNail.jpg" 
    alt="Ocean"
    name="oceanpic" id="oceanpic"
    onclick="displayMessage('Bachelors degrees in Sport Business and 
Business Management')"
    onclick="changeImage('oecan.jpg')">
    </td>

    <td id="pizza" name="pizza">
    <input type="image" 
    src="pizza-tNail.jpg" 
    alt="Pizza"
    name="pizzapic" id="pizzapic"
    onclick="displayMessage('Minor in Hospitality')"
    onclick="changeImage('pizza.jpg')">
    </td>

    <td id="sunflower" name="sunflower">
    <input type="image" 
    src="sunflower-tNail.jpg" 
    alt="Sunflower"
    name="sunflowerpic" id="sunflowerpic"
    onclick="displayMessage('Taken after receiving my diploma!')"
    onclick="changeImage('sunflower.jpg')">
    </td>

    <td id="softball" name="softball">
    <input type="image" 
    src="softball-tNail.jpg" 
    alt="Softball"
    name="softballpic" id="softballpic"
    onclick="displayMessage('Graduation was on April 30, 2016 in Saint Leo, 
Florida')"
    onclick="changeImage('softball.jpg')">
    </td>
</tr>

<tr id="thirdrow" name="thirdrow">

    <th id="kendal" name="kendal" colspan="5">
    <input type="image" 
    src="kendal.jpg" 
    alt="Kendal LeFrancois" 
    height="750px" width="750px"
    name="kendalpic" id="kendalpic"></th>
</tr>

<tr id="fourthrow" name="fourthrow">

    <th id="writing" name="writing" colspan="5">Kendal LeFrancois</th>

</tr>

</tbody>
</table>

</form>

</body>
</html>

Answer 1

你错过了几个引号。改变这个：

<td id="svu" name="svu">
    <input type="image" 
    src="svu-tNail.jpg" 
    alt="Law Order SVU"
    name="svupic" id="svupic"
    onclick="changes('svu.jpg, Saint Leo Graduation 2016')">
    </td>

到此：

<td id="svu" name="svu">
    <input type="image" 
    src="svu-tNail.jpg" 
    alt="Law Order SVU"
    name="svupic" id="svupic"
    onclick="changes('svu.jpg', 'Saint Leo Graduation 2016')">
    </td>

Answer 2

有很多错误，以下是解决方法：

1-删除＆＃34;表格＆＃34;标签

2-有一些函数changeMessage和changeImage不在脚本中（你的函数是changes(messeage,image)）

3-您忘记在脚本中的每个语句末尾添加';' -

4-first参数是消息而不是图像，你也错过了引号：

更改：onclick="changes('svu.jpg, Saint Leo Graduation 2016')"

收件人：onclick="changes('Saint Leo Graduation 2016','svu.jpg')"＆gt;

＆＃13;

</style>

<script>
function changes(newMessage, imageName)
{
var elementToUpdate = document.getElementById("writing");
elementToUpdate.innerHTML = newMessage;

var toChange = document.getElementById("kendal");
toChange.src = imageName;
}
</script>

</head>
<body>


<table id="table" name="table" border="1">
<tbody id="tablebody" name="tablebody">

<tr id="firstrow" name="firstrow">
    <th id="header1" name="header1" colspan="5">Click on Image to 
Enlarge</th>
</tr>

<tr id="secondrow" name="secondrow">

    <td id="svu" name="svu">
    <input type="image" 
    src="svu-tNail.jpg" 
    alt="Law Order SVU"
    name="svupic" id="svupic"
    onclick="changes('Saint Leo Graduation 2016','svu.jpg')">
    </td>

    <td id="ocean" name="ocean">
    <input type="image" 
    src="ocean-tNail.jpg" 
    alt="Ocean"
    name="oceanpic" id="oceanpic"
    onclick="changes('Bachelors degrees in Sport Business and Business Management','oecan.jpg')">
    </td>

    <td id="pizza" name="pizza">
    <input type="image" 
    src="pizza-tNail.jpg" 
    alt="Pizza"
    name="pizzapic" id="pizzapic"
    onclick="changes('Minor in Hospitality','pizza.jpg')"
    </td>

    <td id="sunflower" name="sunflower">
    <input type="image" 
    src="sunflower-tNail.jpg" 
    alt="Sunflower"
    name="sunflowerpic" id="sunflowerpic"
    onclick="changes('Taken after receiving my diploma!','sunflower.jpg')">
    </td>

    <td id="softball" name="softball">
    <input type="image" 
    src="softball-tNail.jpg" 
    alt="Softball"
    name="softballpic" id="softballpic"
    onclick="changes('Graduation was on April 30, 2016 in Saint Leo, Florida','softball.jpg')">
    </td>
</tr>

<tr id="thirdrow" name="thirdrow">

    <th id="kendal" name="kendal" colspan="5">
    <input type="image" 
    src="kendal.jpg" 
    alt="Kendal LeFrancois" 
    height="750px" width="750px"
    name="kendalpic" id="kendalpic"></th>
</tr>

<tr id="fourthrow" name="fourthrow">

    <th id="writing" name="writing" colspan="5">Kendal LeFrancois</th>

</tr>

</tbody>
</table>


</body>

＆＃13;

需要通过具有两个参数的函数来更改图像和文本

2 个答案: