我正在尝试更新名为 id_0-instruction_task_one_image
的隐藏输入字段的值使用 java 脚本加载页面时使用特定图像文件的文件名和 <img onload="
这是我用来更新隐藏字段的脚本:
<script type="text/javascript">
function updateInput(ish) {
document.getElementById("id_0-instruction_task_one_image").value = ish;
}
</script>
这是图像的文件路径,注意我还将文件名加载到value
中字段:
<div class="image_rating">
<img src="{% static "survey/images/instruction_task_one/" %}{{display_image}}" value={{display_image}} onload="updateInput(this.value)"/>
</div>
当我加载页面时,图像将被显示,并且相同的文件名位于值字段中,例如value="ITI1.jpg"
但是,隐藏的表单字段无法正确更新,而是显示 value="undefined"
如下
<input id="id_0-instruction_task_one_image" name="0-instruction_task_one_image" type="hidden" value="undefined"/>
谁能告诉我我做错了什么?我已经为此工作了一段时间,我相信它应该有效。谢谢
最佳答案
我认为您访问和设置 html 元素属性的方式存在问题。尝试在元素上使用 getAttribute
和 setAttribute
,如下所示:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Set Attribute Value</title>
</head>
<body>
<div class="image_rating">
<img id="myImage" src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/86/JosephBazalgettePortrait.jpg/100px-JosephBazalgettePortrait.jpg"
value="myValue" onload="updateInput(this)" />
</div>
<input id="id_0-instruction_task_one_image" name="0-instruction_task_one_image" type="hidden"
value="undefined" />
<script type="text/javascript">
function updateInput(ish) {
var valueAttribute = ish.getAttribute("value");
document.getElementById("id_0-instruction_task_one_image").setAttribute(
"value", valueAttribute);
}
</script>
</body>
</html>
关于javascript - 使用页面加载时图像的名称更新隐藏的输入字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31014741/